<!--流程业务化-异常解除，包含所有的设备、工装、工具异常-->

<!--用户权限说明-->
<!--管理员：代码：1，可以做所有的操作-->
<!---->
<template>
  <div style="margin: 0;padding: 0">
    <el-container>
      <!--页面表头设计-->
      <el-header style="height: 39px">
        <el-link class="headMain" href="http://10.255.96.48:3404/">{{ main.qualityManagementSystem }}</el-link>
        <span class="center-text">{{ main.alarmRelease }}</span>
        <el-popover
            placement="top-start"
            title="用户信息"
            width="200"
            trigger="hover">
          <div style="margin-top: 10px">Name：{{ useName }}</div>
          <div style="margin-top: 10px">ID:{{ useId }}</div>
          <div style="margin-top: 10px" @click="logOut">
            <el-link>退出</el-link>
          </div>
          <div class="headMain" slot="reference">{{ useName }}</div>
        </el-popover>
      </el-header>
      <el-container>
        <el-aside width="200px" style="height: 90vh">
          <div style="margin-top:10px;">
            <el-button style="width: 100%"
                       :style="{backgroundColor:buttonBackColor1,color:buttonColor1}"
                       @click="buttonMainSelect(1)">{{ main.allSteps }}
            </el-button>
          </div>
          <div style="margin-top:10px;">
            <el-button style="width: 100%"
                       :style="{backgroundColor:buttonBackColor2,color:buttonColor2}"
                       @click="buttonMainSelect(2)">{{ main.assemblyWorkshop }}
            </el-button>
          </div>
          <div style="margin-top:10px;">
            <el-button style="width: 100%"
                       :style="{backgroundColor:buttonBackColor3,color:buttonColor3}"
                       @click="buttonMainSelect(3)">{{ main.machiningWorkshop }}
            </el-button>
          </div>
          <div style="margin-top:10px;">
            <el-button style="width: 100%"
                       :style="{backgroundColor:buttonBackColor4,color:buttonColor4}"
                       @click="buttonMainSelect(4)">{{ main.otherSteps }}
            </el-button>
          </div>
        </el-aside>
        <el-container>
          <!--主题设计-->
          <el-main style="height: calc(80vh - 83px);overflow: auto">
            <el-tabs v-model="activeName" @tab-click="handleClick">
              <el-tab-pane :label="pageVal.alarmProblemList" name="exception">
                <div style="margin-bottom: 5px;text-align: right">
                  <span style="font-size: 14px;margin-right: 5px">{{ pageVal.shiftFilter }}</span>
                  <el-date-picker
                      v-model="dateOneDay"
                      type="date"
                      :placeholder="pageVal.selectDate"
                      format="yyyy-MM-dd"
                      value-format="yyyy-MM-dd"
                      size="mini"
                      @change="dateOneDayChange"
                      style="width: 130px">
                  </el-date-picker>
                  <el-select v-model="shiftType"
                             :placeholder="pageVal.select"
                             style="width: 70px;margin-left: 5px"
                             size="mini"
                              @change="shiftTypeChange">
                    <el-option
                        v-for="item in shiftOptions"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                    </el-option>
                  </el-select>
                  <span style="font-size: 14px;margin-right: 5px;margin-left: 5px">{{ pageVal.op }}</span>
                  <el-select v-model="opTypeList" :placeholder="pageVal.select" style="width: 90px;margin-left: 5px" clearable
                             size="mini">
                    <el-option
                        v-for="item in op"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                    </el-option>
                  </el-select>
                  <span style="font-size: 14px;margin-right: 5px;margin-left: 5px">{{ pageVal.timeFilter }}</span>
                  <el-date-picker
                      v-model="dateTimeScope"
                      type="datetimerange"
                      :range-separator="pageVal.to"
                      :start-placeholder="pageVal.startTime"
                      :end-placeholder="pageVal.endTime"
                      size="mini"
                      style="margin-right: 10px"
                      format="yyyy-MM-dd HH:mm:ss"
                      value-format="yyyy-MM-dd HH:mm:ss"
                      @change="dateTimeScopeChange">
                  </el-date-picker>
                  <el-button size="mini" @click="editExceptionShow(1,null)">{{ pageVal.add }}</el-button>
                </div>
                <el-table
                    :data="exceptionData"
                    border
                    style="width: 100%;"
                    height="64vh">
                  <el-table-column type="expand"
                                   v-slot:default="scope">
                    <el-descriptions :title="pageVal.otherInformation" border :column="4">
                      <el-descriptions-item :label="pageVal.downtime">{{ scope.row.downTimeOp }}</el-descriptions-item>
                      <el-descriptions-item :label="pageVal.lineStopTime">{{ scope.row.downTimeLine }}
                      </el-descriptions-item>
                      <el-descriptions-item :label="pageVal.caller">{{ scope.row.excPersonName }}</el-descriptions-item>
                      <el-descriptions-item :label="pageVal.releasePerson">{{ scope.row.liftName }}
                      </el-descriptions-item>
                      <el-descriptions-item :label="pageVal.recoveryType">{{ scope.row.restorationType }}
                      </el-descriptions-item>
                    </el-descriptions>
                  </el-table-column>
                  <el-table-column
                      prop="op"
                      :label="pageVal.op"
                      width="80">
                  </el-table-column>
                  <el-table-column
                      prop="excMessage"
                      :label="pageVal.alarmInformation"
                      :show-overflow-tooltip="true">
                  </el-table-column>
                  <el-table-column
                      prop="partId"
                      :label="pageVal.engineNumber"
                      width="180">
                  </el-table-column>
                  <el-table-column
                      prop="excDate"
                      :label="pageVal.alarmTime"
                      width="160">
                  </el-table-column>
                  <el-table-column
                      prop="isProductionOk"
                      :label="pageVal.isQualified"
                      width="100">
                  </el-table-column>
                  <el-table-column
                      prop="workArea"
                      label="报警区域"
                      width="100">
                  </el-table-column>
                  <el-table-column
                      prop="alarmLevel"
                      label="报警等级"
                      width="80">
                  </el-table-column>
                  <el-table-column
                      prop=""
                      :label="pageVal.edit"
                      width="80"
                      v-slot:default="scope">
                    <el-link @click="editExceptionShow(2,scope)" style="margin-right: 8px"><i class="el-icon-edit"></i>
                    </el-link>
                    <el-link @click="editExceptionShow(3,scope)" style="margin-right: 8px"><i
                        class="el-icon-delete"></i></el-link>
                    <el-link @click="editExceptionShow(4,scope)"><i class="el-icon-user"></i></el-link>

                  </el-table-column>
                </el-table>
              </el-tab-pane>
              <el-tab-pane :label="pageVal.alarmAnalysis" name="exceptionAnalysis">
                <div style="text-align: left;overflow-y: auto;height: 63vh">
                  <span>{{ pageVal.alarmQuantity }}</span>
                  <div style="margin-bottom: 5px;text-align: right">
                    <span style="font-size: 14px;margin-right: 5px">{{ pageVal.shiftFilter }}</span>
                    <el-date-picker
                        v-model="dateOneDay"
                        type="date"
                        :placeholder="pageVal.selectDate"
                        format="yyyy-MM-dd"
                        value-format="yyyy-MM-dd"
                        size="mini"
                        style="width: 130px"
                        @change="dateOneDayChange">
                    </el-date-picker>
                    <el-select v-model="shiftType" :placeholder="pageVal.select" style="width: 70px;margin-left: 5px"
                               size="mini" @change="shiftTypeChange">
                      <el-option
                          v-for="item in shiftOptions"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value">
                      </el-option>
                    </el-select>
                    <span style="font-size: 14px;margin-right: 5px;margin-left: 5px">{{ pageVal.timeFilter }}</span>
                    <el-date-picker
                        v-model="dateTimeScope"
                        type="datetimerange"
                        :range-separator="pageVal.to"
                        :start-placeholder="pageVal.startTime"
                        :end-placeholder="pageVal.endTime"
                        size="mini"
                        style="margin-right: 10px"
                        format="yyyy-MM-dd HH:mm:ss"
                        value-format="yyyy-MM-dd HH:mm:ss">
                    </el-date-picker>
                  </div>
                  <div ref="stationNub" style="width: 82vw;height: 250px;margin-top: 5px;border: 1px solid blue;"></div>
                  <span>{{ pageVal.alarmReleasedQuantity }}</span>
                  <div style="display: flex;">
                    <div ref="stationNubFinish"
                         style="width: 61vw;height: 250px;margin-top: 5px;border: 1px solid blue;"></div>
                    <div ref="stationDepartment"
                         style="width: 20vw;height: 250px;margin-top: 5px;border: 1px solid blue; margin-left:15px;"></div>
                  </div>
                  <span>{{ pageVal.alarmTrendChart }}</span>
                  <div style="margin-bottom: 5px;text-align: right">
                    <span style="font-size: 14px;margin-right: 5px;margin-left: 5px">{{ pageVal.op }}</span>
                    <el-select v-model="opType" :placeholder="pageVal.select" style="width: 90px;margin-left: 5px"
                               size="mini">
                      <el-option
                          v-for="item in op"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value">
                      </el-option>
                    </el-select>
                    <span style="font-size: 14px;margin-right: 5px;margin-left: 5px">{{ pageVal.timeFilter }}</span>
                    <el-date-picker
                        v-model="dateTimeScopeOp"
                        type="datetimerange"
                        :range-separator="pageVal.to"
                        :start-placeholder="pageVal.startTime"
                        :end-placeholder="pageVal.endTime"
                        size="mini"
                        style="margin-right: 10px"
                        format="yyyy-MM-dd 08:20:00"
                        value-format="yyyy-MM-dd HH:mm:ss">
                    </el-date-picker>
                  </div>
                  <div ref="stationNubOp"
                       style="width: 82vw;height: 250px;margin-top: 5px;border: 1px solid blue;"></div>
                </div>
              </el-tab-pane>
              <el-tab-pane :label="pageVal.alarmTypeList" name="alarmList">
                <el-table
                    :data="plcAlarmSettingData"
                    border
                    style="width: 100%">
                  <el-table-column
                      prop="workShop"
                      label="车间名称"
                      width="150">
                  </el-table-column>
                  <el-table-column
                      prop="workArea"
                      label="线体区域"
                      width="90">
                  </el-table-column>
                  <el-table-column
                      prop="stationID"
                      label="工位名称"
                      width="90">
                  </el-table-column>
                  <el-table-column
                      prop="dbBlock"
                      label="DB块代码"
                      width="60">
                  </el-table-column>
                  <el-table-column
                      prop="dbByte"
                      label="DB块字节"
                      width="60">
                  </el-table-column>
                  <el-table-column
                      prop="dbBit"
                      label="DB块位"
                      width="60">
                  </el-table-column>
                  <el-table-column
                      prop="alarmInformationChinese"
                      label="中文报警"
                      width="280">
                  </el-table-column>
                  <el-table-column
                      prop="alarmInformationRussian"
                      label="俄文报警"
                      width="280">
                  </el-table-column>
                  <el-table-column
                      prop="alarmLevel"
                      label="报警等级"
                      width="80">
                  </el-table-column>
                  <el-table-column
                      label="编辑"
                      width="80"
                      v-slot:default="scope">
                    <el-link @click="plcAlarmSettingEditShow(2,scope)">
                      <i class="el-icon-edit"></i>
                    </el-link>
                  </el-table-column>
                </el-table>
              </el-tab-pane>
              <el-tab-pane :label="pageVal.modelSpecification" name="third">
                <div style="display: flex; gap: 10px">
                  <el-card shadow="hover" style="width: 120px">报警/异常开始</el-card>
                  <el-card shadow="hover" style="width: 120px"><span style="color: red">报警解除</span></el-card>
                  <el-card shadow="hover" style="width: 120px">原工艺恢复</el-card>
                  <el-card shadow="hover" style="width: 120px">班长前后5件确认</el-card>
                  <el-card shadow="hover" style="width: 120px">检验前后5件确认<i class="el-icon-right"></i></el-card>
                  <el-card shadow="hover" style="width: 120px">异常进入可疑品管理</el-card>
                </div>
                <div style="display: flex; gap: 10px;margin-top: 10px">
                  <el-card shadow="hover" style="width: 120px;margin-left: 265px">使用ByPass</el-card>
                  <el-card shadow="hover" style="width: 120px">班长前后5件确认</el-card>
                  <el-card shadow="hover" style="width: 120px">检验前后5件确认</el-card>
                  <el-card shadow="hover" style="width: 120px">异常进入可疑品管理</el-card>
                  <el-card shadow="hover" style="width: 120px">下发变化点</el-card>
                  <el-card shadow="hover" style="width: 120px">按照变化点管理</el-card>
                </div>
                <div style="display: flex; gap: 10px;margin-top: 10px">
                  <el-card shadow="hover" style="width: 120px;margin-left: 135px">可疑品处理</el-card>
                  <el-card shadow="hover" style="width: 120px">可疑品判定</el-card>
                  <el-card shadow="hover" style="width: 120px">产品返工：</el-card>
                  <el-card shadow="hover" style="width: 120px">下发返工要领</el-card>
                  <el-card shadow="hover" style="width: 120px">返工实施</el-card>
                  <el-card shadow="hover" style="width: 120px">产品判定</el-card>
                  <el-card shadow="hover" style="width: 120px">产品装机</el-card>
                </div>
                <div style="display: flex; gap: 10px;margin-top: 10px">
                  <el-card shadow="hover" style="width: 120px;margin-left: 400px">产品报废：</el-card>
                  <el-card shadow="hover" style="width: 120px">产品开票</el-card>
                  <el-card shadow="hover" style="width: 120px">产品退库</el-card>
                  <el-card shadow="hover" style="width: 120px">产品报废</el-card>
                </div>
                <div style="display: flex; gap: 10px;margin-top: 10px">
                  <el-card shadow="hover" style="width: 120px;margin-left: 400px">产品退供方：</el-card>
                  <el-card shadow="hover" style="width: 120px">产品开票</el-card>
                  <el-card shadow="hover" style="width: 120px">产品退库</el-card>
                  <el-card shadow="hover" style="width: 120px">产品退供方</el-card>
                </div>
                <div style="display: flex; gap: 10px;margin-top: 10px">
                  <el-card shadow="hover" style="width: 120px;margin-left: 135px">可疑品追溯</el-card>
                  <el-card shadow="hover" style="width: 120px">判定是否追溯</el-card>
                  <el-card shadow="hover" style="width: 120px">需要追溯</el-card>
                  <el-card shadow="hover" style="width: 120px">下发追溯方案</el-card>
                  <el-card shadow="hover" style="width: 120px">实施追溯</el-card>
                  <el-card shadow="hover" style="width: 120px">追溯总结</el-card>
                </div>
                <div style="display: flex; gap: 10px;margin-top: 10px">
                  <el-card shadow="hover" style="width: 120px;margin-left: 135px">问题解决</el-card>
                  <el-card shadow="hover" style="width: 120px">原因分析</el-card>
                  <el-card shadow="hover" style="width: 120px">对策实施</el-card>
                  <el-card shadow="hover" style="width: 120px">效果验证</el-card>
                  <el-card shadow="hover" style="width: 120px">横展</el-card>
                  <el-card shadow="hover" style="width: 120px">需追究供方责任</el-card>
                  <el-card shadow="hover" style="width: 120px">发起索赔</el-card>
                  <el-card shadow="hover" style="width: 120px">实施索赔</el-card>
                  <el-card shadow="hover" style="width: 120px">索赔完结</el-card>
                </div>
              </el-tab-pane>
            </el-tabs>
          </el-main>
          <el-footer style="height: 44px">
            <el-button plain size="mini" @click="chooseLanguage('chinese')">中 文</el-button>
            <el-button plain size="mini" @click="chooseLanguage('russian')">Русский язык</el-button>
            <el-button plain size="mini" @click="chooseLanguage('english')">English</el-button>
          </el-footer>
        </el-container>
      </el-container>
    </el-container>

    <!--弹窗放置区-->
    <!--新增一个报警、异常解除信息的弹窗-->
    <el-dialog
        :title="titleUse"
        :visible.sync="exceptionDialog"
        width="650px"
        :before-close="handleClose">
      <el-form ref="suspectListForm" :inline="true" :model="exceptionForm" label-width="100px">
        <div>
          <el-form-item :label="pageVal.workshop">
            <el-select v-model="exceptionForm.workShop" filterable clearable :placeholder="pageVal.select"
                       style="margin-left: 10px;width: 450px" :disabled=disabledEdit>
              <el-option
                  v-for="item in optionWorkshopNew"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="pageVal.line">
            <el-select v-model="exceptionForm.lineName" filterable clearable :placeholder="pageVal.select"
                       style="margin-left: 10px;width: 450px" :disabled=disabledEdit>
              <el-option
                  v-for="item in lineName"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="pageVal.op">
            <el-select v-model="exceptionForm.op" filterable clearable :placeholder="pageVal.select"
                       style="width: 175px" :disabled=disabledEdit>
              <el-option
                  v-for="item in op"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="pageVal.feedbackPerson">
            <el-input v-model="exceptionForm.excPersonName" style="width: 175px" :disabled=disabledEdit></el-input>
          </el-form-item>
          <el-form-item :label="pageVal.occurrenceTime" label-width="100px">
            <el-date-picker
                v-model="exceptionForm.excDate"
                type="datetime"
                :placeholder="pageVal.selectDate"
                value-format="YYYY-MM-dd HH:mm:ss"
                style="width: 450px" :disabled=disabledEdit>
            </el-date-picker>
          </el-form-item>
          <el-form-item :label="pageVal.downtime" label-width="100px">
            <el-input-number v-model="exceptionForm.downTimeOp" style="width: 175px"
                             :disabled=disabledEdit></el-input-number>
          </el-form-item>
          <el-form-item :label="pageVal.lineStopTime">
            <el-input-number v-model="exceptionForm.downTimeLine" style="width: 175px"
                             :disabled=disabledEdit></el-input-number>
          </el-form-item>
          <el-form-item :label="pageVal.alarmInformation">
            <el-input v-model="exceptionForm.excMessage"
                      type="textarea"
                      :rows="2"
                      :placeholder="pageVal.enter"
                      style="width: 450px" :disabled=disabledEdit></el-input>
          </el-form-item>
          <!-- 新增功能：编辑按钮弹窗后，增加是否合格 ，原工艺/bypass 两个下拉选项按钮-->
          <el-form-item :label="pageVal.isOk">
            <el-select v-model="exceptionForm.isProductionOk" filterable clearable :placeholder="pageVal.select"
                       style="width: 175px">
              <el-option
                  v-for="item in isOkOption"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="pageVal.restoration">
            <el-select v-model="exceptionForm.restorationType" filterable clearable :placeholder="pageVal.select"
                       style="width: 175px">
              <el-option
                  v-for="item in restorationTypeOption"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>


        </div>
        <el-button @click="exceptionDialog=false">{{ pageVal.cancel }}</el-button>
        <el-button type="primary" @click="exceptionEdit">{{ pageVal.ok }}</el-button>
      </el-form>
    </el-dialog>
    <!--编辑报警信息表-->
    <el-dialog
        :title="titleUse"
        :visible.sync="plcAlarmSettingDialog"
        width="30%"
        :before-close="handleClose">
      <el-form :model="plcAlarmSettingFrom" label-width="120px">
        <el-form-item label="中文报警信息：">
          <el-input v-model="plcAlarmSettingFrom.alarmInformationChinese" placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item label="俄文报警信息：">
          <el-input v-model="plcAlarmSettingFrom.alarmInformationRussian" placeholder="请输入内容"></el-input>
        </el-form-item>
        <el-form-item label="报警等级：">
          <el-select v-model="plcAlarmSettingFrom.alarmLevel" placeholder="请选择" style="width: 100%">
            <el-option
                v-for="item in plcAlarmLevelOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>

      </el-form>

      <span slot="footer" class="dialog-footer">
         <el-button @click="plcAlarmSettingDialog = false">取 消</el-button>
         <el-button type="primary" @click="plcAlarmSettingEditOk">确 定</el-button>
      </span>
    </el-dialog>
    <!--抽屉放置区域-->
  </div>
</template>

<script>
import {OpAssemblyOil, opList, optionWorkshopNew,} from "@/configUse";
import _ from "lodash";
import * as echarts from "echarts";

export default {
  name: "workExceptionRemoval",
  components: {},
  data() {
    return {
      activeName: 'exception',
      //用户权限相关的变量
      useName: '',//用户名称
      useId: '',//用户编号
      usePower: '',//用户权限

      //记录语言选择
      languageS: 'chinese',
      main: {
        qualityManagementSystem: '俄动力质量管理系统',
        alarmRelease: '报警/故障解除业务',
        allSteps: '所有环节',
        assemblyWorkshop: '装配车间',
        machiningWorkshop: '机加车间',
        otherSteps: '其他环节'
      },
      pageVal: {
        alarmProblemList: '报警/故障问题清单',
        shiftFilter: '班次筛选：',
        selectDate: '选择日期',
        select: '请选择',
        timeFilter: '时间筛选：',
        to: '至',
        startTime: '开始时间',
        endTime: '结束时间',
        add: '添加',
        otherInformation: '其他信息：',
        downtime: '停机时间：',
        lineStopTime: '停线时间：',
        caller: '报警人：',
        releasePerson: '解除人：',
        recoveryType: '恢复类型：',
        op: '工序号',
        alarmInformation: '报警信息',
        engineNumber: '发动机号',
        alarmTime: '报警时间(北京)',
        isQualified: '是否合格',
        problemProgress: '问题进度',
        unfinishedQuestions: '未结题',
        closedQuestions: '已结题',
        pending: '挂起',
        edit: '编辑',

        alarmAnalysis: '报警/故障分析',
        alarmQuantity: '选择范围各工序报警数量：',
        alarmReleasedQuantity: '选择范围各工序报警解除完成数量：',
        alarmTrendChart: '各工序报警趋势图：',

        alarmTypeList: '报警/故障类型清单',

        //dialog
        modelSpecification: '模型说明',
        workshop: '车间名称',
        line: '线体名称',
        feedbackPerson: '反馈人',
        occurrenceTime: '发生时间',
        enter: '请输入内容',
        ok: '确定',
        cancel: '取消',
        isOk: '是否合格',
        restoration: '恢复类型'
      },

      buttonDoe: 1,//用户选择的是那个按钮
      buttonBackColor1: 'blue',//按钮的背景颜色
      buttonColor1: 'white',//按钮的字体颜色
      buttonBackColor2: '',//按钮的背景颜色
      buttonColor2: '',//按钮的字体颜色
      buttonBackColor3: '',//按钮的背景颜色
      buttonColor3: '',//按钮的字体颜色
      buttonBackColor4: '',//按钮的背景颜色
      buttonColor4: '',//按钮的字体颜色
      optionWorkshopNew: optionWorkshopNew,//记录车间名称的选择器
      lineName: [],//记录线体名称的选择器
      op: opList,//记录工序号的选择器
      //记录的是报警问题的列表
      exceptionData: [
        {
          id: null,//主键
          establishTime: '',//创建时间
          updateTime: '',//修改时间
          deleteSign: '',//删除标记
          editName: '',//编辑人

          workShop: '',//车间名称，三种语言
          lineName: '',//线体名称
          op: '',//工序号
          excMessage: '',//报警信息
          excDate: '',//报警时间
          excPersonName: '',//报警反馈人
          excType: '',//报警类别
          isProblem: -1,//-1代表，没有完结，0代表问题没有关闭；1代表问题关闭
          downTimeOp: 0,//停机时间
          downTimeLine: 0,//停线时间
          partId: '',//零部件号

          liftName: '',//解除人姓名
          restorationType: '',//恢复类型
          isProductionOk: '',//产品是否合格

          create_time: '',             // 创建时间
          update_time: '',             // 最后更新时间
          creator: '',                 // 创建人
          process_status: '',          // 处理状态
          sys_update_user: '',         // 系统更新人
          sys_audit_user: '',          // 系统审核人
          sys_audit_time: '',          // 系统审核时间
          sys_deleted: 0,       // 系统删除标记（0未删除，1已删除）
          workArea: '',                  // 报警区域 （内装 外装 GG）
          alarmLevel: '',                // 报警级别（班长、品检、设备、品技）
        },
      ],//记录的事报警、异常解除的大表数据
      exceptionDataScope: null,//记录的是用户点击的哪一行报警、故障行
      exceptionForm: {
        id: null,//主键
        establishTime: '',//创建时间
        updateTime: '',//修改时间
        deleteSign: '',//删除标记
        editName: '',//编辑人

        workShop: '',//车间名称，三种语言
        lineName: '',//线体名称
        op: '',//工序号
        excMessage: '',//报警信息
        excDate: '',//报警时间
        excPersonName: '',//报警反馈人
        excType: '',//报警类别
        isProblem: -1,//-1代表，没有完结，0代表问题没有关闭；1代表问题关闭
        downTimeOp: 0,//停机时间
        downTimeLine: 0,//停线时间

        liftName: '',//解除人姓名
        restorationType: '',//恢复类型
        isProductionOk: '',//产品是否合格

        create_time: '',             // 创建时间
        update_time: '',             // 最后更新时间
        creator: '',                 // 创建人
        process_status: '',          // 处理状态
        sys_update_user: '',         // 系统更新人
        sys_audit_user: '',          // 系统审核人
        sys_audit_time: '',          // 系统审核时间
        sys_deleted: 0               // 系统删除标记（0未删除，1已删除）
      },//用户编辑某一行用到的数据
      exceptionDoe: null,//用户要对报警问题的进行什么操作：1.新增；2.编辑；3.删除；

      //页面用到的变量：用户选择看是那一段的报警信息
      dateTimeScope: '',
      //页面用到的变量：用户需要看工序和一段时间的报警信息
      dateTimeScopeOp: '',
      //页面用到的变量：用户选择的是哪一天的报警信息
      dateOneDay: '',
      //页面用到的变量：用户选择的是那个班次
      shiftType: '',
      //筛选工序，用在了报警故障分析页面
      opType: '',
      //筛选工序，用在了报警列表页面中的筛选
      opTypeList:'',

      //选择器的变量
      //选择班次
      shiftOptions: [
        {value: '早班/morning Shift/Ранняя смена', label: '早班/morning Shift/Ранняя смена'},
        {value: '中班/middle shift/Средний класс', label: '中班/middle shift/Средний класс'},
        {value: '夜班/night shift/Ночная работа', label: '夜班/night shift/Ночная работа'},
      ],
      //工序选择器
      opOptions: OpAssemblyOil,
      //是否合格
      isOkOption: [
        {label: 'YES', value: 'YES'},
        {label: 'NO', value: 'NO'}
      ],
      //恢复方式
      restorationTypeOption: [
        {
          label: '原工艺恢复/ Original Process Restored/ Исходный процесс восстановлен',
          value: '原工艺恢复/ Original Process Restored/ Исходный процесс восстановлен'
        },
        {label: 'Bypass', value: 'Bypass'}
      ],

      //定义一个变量，是否禁用输入窗口
      disabledEdit: false,

      //报警故障类型清单总表；这个表需要走《基础维护》的接口，在这页上不能进行编辑，只能进行查看，这个表也不需要低代码进行维护
      exceptionTypeData: [{
        id: null,//主键
        establishTime: '',//创建时间
        updateTime: '',//修改时间
        deleteSign: '',//删除标记
        editName: '',//编辑人
        workShop: '',//车间名称，三种语言
        lineName: '',//线体名称
        op: '',//工序号
        excMessage: '',//报警信息
        excId: '',//报警代码
        plcId: '',//plc信号代码
        plcAddress: '',//PLC地址
        downTimeOp: 0,//停机时间
        downTimeLine: 0,//停线时间
      }],

      //弹窗控制的变量
      //控制弹窗的提示：
      titleUse: '',
      //增加、编辑异常的弹窗
      exceptionDialog: false,
      //画图相关的变量
      //根据用户选择的日期，画这段时间内各工序的报警排序
      stationNub: null,
      //根据用户现在的日期，画这段时间内各工序的报警解除记录数据
      stationNubFinish: null,
      //画出每个部门负责报警解除的图像
      stationDepartment: null,
      //根据用户选择，画出某一序的报警趋势
      stationNubOp: null,
      //报警解除的报警信息基本表
      plcAlarmSettingData: [
        {
          //主键
          id: 0,
          //车间的名称
          workShop: '',
          //工作区域 ==> 缸盖/内装 ，外装
          workArea: '',
          //工位名称
          stationID: '',
          //PLC的IP地址
          plcIPaddress: '',
          //PLC的DB数据块
          dbBlock: '',
          //PLC的DB块的字节
          dbByte: '',
          //PLC的DB块的位
          dbBit: '',
          //PLC中读取发动机号的设置地址
          partNumberDB: '',
          //PLC中读取到的报警代号
          alarmCode: '',
          //设定的报警文本信息-中文
          alarmInformationChinese: '',
          //设定的报警文本信息-俄文
          alarmInformationRussian: '',
          //设定的报警文本信息-英文
          alarmInformationEnglish: '',
          //报警等级
          alarmLevel: ''
        }
      ],
      //报警解除的报警信息基本表编辑表单
      plcAlarmSettingFrom: {
        //主键
        id: 0,
        //车间的名称
        workShop: '',
        //工作区域 ==> 缸盖/内装 ，外装
        workArea: '',
        //工位名称
        stationID: '',
        //PLC的IP地址
        plcIPaddress: '',
        //PLC的DB数据块
        dbBlock: '',
        //PLC的DB块的字节
        dbByte: '',
        //PLC的DB块的位
        dbBit: '',
        //PLC中读取发动机号的设置地址
        partNumberDB: '',
        //PLC中读取到的报警代号
        alarmCode: '',
        //设定的报警文本信息-中文
        alarmInformationChinese: '',
        //设定的报警文本信息-俄文
        alarmInformationRussian: '',
        //设定的报警文本信息-英文
        alarmInformationEnglish: '',
        //报警等级
        alarmLevel: ''
      },
      //用户对报警解除的报警信息基本表编辑表单的操作类型
      plcAlarmSettingDoe: 0,
      //用户对报警解除的报警信息基本表编辑表单的操作类型--用户选择的哪一行
      plcAlarmSettingScope: null,
      //控制弹窗的变量
      plcAlarmSettingDialog: false,
      //PLC报警信息基础表中，对应的PLC报警等级
      plcAlarmLevelOptions: [
        {label: '班长', value: '班长'},
        {label: '检验', value: '检验'},
        {label: '设备', value: '设备'},
        {label: '品技', value: '品技'}
      ],
    }
  },
  watch: {
    //页面用到的变量：用户要统计某一序某一段时间内的报警数量
    dateTimeScopeOp(newVal) {
      //需要筛选出后两天的报警信息才对
      // 将日期字符串转换为 Date 对象
      const addTwoNewVal = new Date(newVal[1]);

      // 检查日期是否有效
      if (isNaN(addTwoNewVal.getTime())) {
        throw new Error("Invalid date string");
      }
      // 增加一天
      addTwoNewVal.setDate(addTwoNewVal.getDate() + 2);
      // 格式化日期为字符串
      const year = addTwoNewVal.getFullYear();
      const month = String(addTwoNewVal.getMonth() + 1).padStart(2, '0'); // 月份从 0 开始
      const day = String(addTwoNewVal.getDate()).padStart(2, '0');
      const hours = String(addTwoNewVal.getHours()).padStart(2, '0');
      const minutes = String(addTwoNewVal.getMinutes()).padStart(2, '0');
      const seconds = String(addTwoNewVal.getSeconds()).padStart(2, '0');

      const addTwoNewValStr = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
      this.queryExceptionOneFiledScopeWorkExceptionRemoval('excDate', newVal[0], addTwoNewValStr).then(data => {
        //选择是那个车间的
        let dataFil = []
        if (this.buttonDoe === 1) {
          dataFil = data
        } else if (this.buttonDoe === 2) {
          dataFil = data.filter(item => item.workShop === '装配车间/Assembly workshop/Цех сборки двигателей')
        }
        //得到数量
        if (this.opType !== '' && this.opType !== null && this.opType !== undefined) {
          let exceptionMorningData = dataFil.filter(item => {
            return item.op === this.opType
          })
          //设定画图的变量，包括了全部、早班、中班、夜班
          let chartStationNubOp = {
            title: {
              textStyle: {
                color: '#333',
                fontSize: 14
              },
              x: 'center',
              text: this.dateTimeScope[0] + '——' + this.dateTimeScope[1] + '报警数量趋势图',
            },
            xAxis: {
              type: 'category',
              data: [],
              axisLabel: {
                rotate: 45,
                fontSize: 11
              }
            },
            yAxis: {
              type: 'value',
              min: 0,
              max: 10,
              axisLabel: {
                formatter: '{value}'
              }
            },
            series: [
              {
                name: '全天数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#1890ff'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
              {
                name: '早班数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#5470C6'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
              {
                name: '中班数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#91CC75'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
            ],
            grid: {
              top: '6%',
              left: '3%',
              right: '4%',
              bottom: '0%',
              containLabel: true
            },
            tooltip: {
              trigger: 'axis',
              axisPointer: {
                type: 'cross',
                label: {
                  backgroundColor: '#6a7985'
                }
              }
            },
            legend: {
              data: ['全天数量', '早班数量', '中班数量'],
              left: 'right',
              top: '0%',
              itemGap: 20,
              textStyle: {
                color: '#333',
                fontSize: 11
              },
              selected: {
                '全天数量': true,
                '早班数量': true,
                '中班数量': true
              },
              toolbox: {
                feature: {
                  saveAsImage: {
                    type: 'png',
                    name: '报警数量趋势图',
                    title: '',
                    pixelRatio: 2,
                    backgroundColor: '#fff',
                    excludeComponents: ['toolbox']
                  },
                  myCopy: {
                    show: true,
                    title: '',
                    icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                    onclick: async () => {
                      if (!this.stationNub) {
                        alert('图表未初始化');
                        return;
                      }
                      // 清除选中状态
                      this.stationNub.dispatchAction({
                        type: 'unselect',
                        seriesIndex: 0
                      });

                      const dataUrl = this.stationNub.getDataURL({
                        type: 'png',
                        pixelRatio: 2,
                        backgroundColor: '#fff'
                      });

                      try {
                        // 将 DataURL 转换为 Blob
                        const response = await fetch(dataUrl);
                        const blob = await response.blob();

                        // 使用 Clipboard API 复制图片
                        await navigator.clipboard.write([
                          new ClipboardItem({
                            [blob.type]: blob
                          })
                        ]);
                        this.$message.success('已复制');
                      } catch (err) {
                        this.$message.success('复制失败');
                      }
                    }
                  }
                },
                right: '0%',
                top: '90%',
                itemSize: 14,
                itemGap: 10,
                textStyle: {
                  fontSize: 11
                },
                iconStyle: {
                  borderColor: '#666',
                  borderWidth: 1,
                  backgroundColor: '#f5f5f5'
                }
              }

            },
          }
          //画出故障总的趋势图,先画不分分班次的，进行赋值，先得到每天的时间数组
          let generateNo = this.generateDateRange(newVal[0], newVal[1], '')
          // 进行相关数据赋值(全部数据）
          for (let i = 0; i < generateNo.length; i++) {
            // 筛选，计算每天出现的数量
            let excOpNumb = exceptionMorningData.filter(item => {
              const excDate = new Date(item.excDate);
              const startDate = new Date(generateNo[i].start);
              const endDate = new Date(generateNo[i].end);

              return excDate >= startDate && excDate <= endDate;
            });
            //先做X轴，做一次就好了，其他班次的就不需要做了
            chartStationNubOp.xAxis.data.push(generateNo[i].start.slice(0, 10))
            //给数据赋值
            chartStationNubOp.series[0].data.push(excOpNumb.length.toString())
            //得到y轴的最大值,只做一次
            // 将字符串数组转换为数字数组
            const numbers = chartStationNubOp.series[0].data.map(Number);

            // 找到最大值,给Y轴
            chartStationNubOp.yAxis.max = (Math.max(...numbers) + Math.ceil(Math.max(...numbers) * 0.15)).toString();
          }

          //  画出故障总的趋势图,画出早班的报警信息，进行赋值
          //进行相关数据赋值（早班）
          let generateMorning = this.generateDateRange(newVal[0], newVal[1], '早班/morning Shift/Ранняя смена')
          // 进行相关数据赋值(早班）
          for (let i = 0; i < generateMorning.length; i++) {
            // 筛选，计算每天出现的数量
            let excOpNumb = exceptionMorningData.filter(item => {
              const excDate = new Date(item.excDate);
              const startDate = new Date(generateMorning[i].start);
              const endDate = new Date(generateMorning[i].end);
              return excDate >= startDate && excDate <= endDate;
            });
            //给数据赋值
            chartStationNubOp.series[1].data.push(excOpNumb.length.toString())
          }

          //画出故障总的趋势图,画出早班的报警信息，进行赋值，先得到每天的时间数组
          //进行相关数据赋值（中班）
          let generateMiddle = this.generateDateRange(newVal[0], newVal[1], '中班/middle shift/Средний класс')
          // 进行相关数据赋值(全部数据）
          for (let i = 0; i < generateMiddle.length; i++) {
            // 筛选，计算每天出现的数量
            let excOpNumb = exceptionMorningData.filter(item => {
              const excDate = new Date(item.excDate);
              const startDate = new Date(generateMiddle[i].start);
              const endDate = new Date(generateMiddle[i].end);
              return excDate >= startDate && excDate <= endDate;
            });
            //给数据赋值
            chartStationNubOp.series[2].data.push(excOpNumb.length.toString())
          }
          //画出图
          this.$nextTick(() => {
            if (!this.stationNubOp) {
              this.stationNubOp = echarts.init(this.$refs.stationNubOp);
            }
            this.stationNubOp.setOption(chartStationNubOp);
          });
        } else {
          this.$message.error('请选择工序')
        }
      });
    },
    //页面用到的变量：用户要查看是哪一个工序下的报警信息,用在了报警分析页面上
    opType(newVal) {
      console.log(newVal)
      //需要筛选出后两天的报警信息才对
      // 将日期字符串转换为 Date 对象
      if (this.dateTimeScopeOp.length === 0) {
        this.$message.error('请选择时间段')
        return
      }
      //去画图，和工序时间的变化是一样
      const addTwoNewVal = new Date(this.dateTimeScopeOp[1]);
      // 检查日期是否有效
      if (isNaN(addTwoNewVal.getTime())) {
        throw new Error("Invalid date string");
      }
      // 增加一天
      addTwoNewVal.setDate(addTwoNewVal.getDate() + 2);
      // 格式化日期为字符串
      const year = addTwoNewVal.getFullYear();
      const month = String(addTwoNewVal.getMonth() + 1).padStart(2, '0'); // 月份从 0 开始
      const day = String(addTwoNewVal.getDate()).padStart(2, '0');
      const hours = String(addTwoNewVal.getHours()).padStart(2, '0');
      const minutes = String(addTwoNewVal.getMinutes()).padStart(2, '0');
      const seconds = String(addTwoNewVal.getSeconds()).padStart(2, '0');

      const addTwoNewValStr = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
      this.queryExceptionOneFiledScopeWorkExceptionRemoval('excDate', this.dateTimeScopeOp[0], addTwoNewValStr).then(data => {
        //得到数量
        if (this.opType !== '' && this.opType !== null && this.opType !== undefined) {
          let exceptionMorningData = data.filter(item => {
            return item.op === this.opType
          })
          //设定画图的变量，包括了全部、早班、中班、夜班
          let chartStationNubOp = {
            title: {
              textStyle: {
                color: '#333',
                fontSize: 14
              },
              x: 'center',
              text: this.dateTimeScopeOp[0] + '——' + this.dateTimeScopeOp[1] + '报警数量趋势图',
            },
            xAxis: {
              type: 'category',
              data: [],
              axisLabel: {
                rotate: 45,
                fontSize: 11
              }
            },
            yAxis: {
              type: 'value',
              min: 0,
              max: 10,
              axisLabel: {
                formatter: '{value}'
              }
            },
            series: [
              {
                name: '全天数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#1890ff'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
              {
                name: '早班数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#5470C6'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
              {
                name: '中班数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#91CC75'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
            ],
            grid: {
              top: '6%',
              left: '3%',
              right: '4%',
              bottom: '0%',
              containLabel: true
            },
            tooltip: {
              trigger: 'axis',
              axisPointer: {
                type: 'cross',
                label: {
                  backgroundColor: '#6a7985'
                }
              }
            },
            legend: {
              data: ['全天数量', '早班数量', '中班数量'],
              left: 'right',
              top: '0%',
              itemGap: 20,
              textStyle: {
                color: '#333',
                fontSize: 11
              },
              selected: {
                '全天数量': true,
                '早班数量': true,
                '中班数量': true
              },
              toolbox: {
                feature: {
                  saveAsImage: {
                    type: 'png',
                    name: '报警数量趋势图',
                    title: '',
                    pixelRatio: 2,
                    backgroundColor: '#fff',
                    excludeComponents: ['toolbox']
                  },
                  myCopy: {
                    show: true,
                    title: '',
                    icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                    onclick: async () => {
                      if (!this.stationNub) {
                        alert('图表未初始化');
                        return;
                      }
                      // 清除选中状态
                      this.stationNub.dispatchAction({
                        type: 'unselect',
                        seriesIndex: 0
                      });

                      const dataUrl = this.stationNub.getDataURL({
                        type: 'png',
                        pixelRatio: 2,
                        backgroundColor: '#fff'
                      });

                      try {
                        // 将 DataURL 转换为 Blob
                        const response = await fetch(dataUrl);
                        const blob = await response.blob();

                        // 使用 Clipboard API 复制图片
                        await navigator.clipboard.write([
                          new ClipboardItem({
                            [blob.type]: blob
                          })
                        ]);
                        this.$message.success('已复制');
                      } catch (err) {
                        this.$message.success('复制失败');
                      }
                    }
                  }
                },
                right: '0%',
                top: '90%',
                itemSize: 14,
                itemGap: 10,
                textStyle: {
                  fontSize: 11
                },
                iconStyle: {
                  borderColor: '#666',
                  borderWidth: 1,
                  backgroundColor: '#f5f5f5'
                }
              }

            },
          }
          //画出故障总的趋势图,先画不分分班次的，进行赋值，先得到每天的时间数组
          let generateNo = this.generateDateRange(this.dateTimeScopeOp[0], this.dateTimeScopeOp[1], '')
          // 进行相关数据赋值(全部数据）
          for (let i = 0; i < generateNo.length; i++) {
            // 筛选，计算每天出现的数量
            let excOpNumb = exceptionMorningData.filter(item => {
              const excDate = new Date(item.excDate);
              const startDate = new Date(generateNo[i].start);
              const endDate = new Date(generateNo[i].end);
              return excDate >= startDate && excDate <= endDate;
            });
            //先做X轴，做一次就好了，其他班次的就不需要做了
            chartStationNubOp.xAxis.data.push(generateNo[i].start.slice(0, 10))
            //给数据赋值
            chartStationNubOp.series[0].data.push(excOpNumb.length.toString())
            //得到y轴的最大值,只做一次
            // 将字符串数组转换为数字数组
            const numbers = chartStationNubOp.series[0].data.map(Number);

            // 找到最大值,给Y轴
            chartStationNubOp.yAxis.max = (Math.max(...numbers) + Math.ceil(Math.max(...numbers) * 0.15)).toString();
          }

          //  画出故障总的趋势图,画出早班的报警信息，进行赋值
          //进行相关数据赋值（早班）
          let generateMorning = this.generateDateRange(this.dateTimeScopeOp[0], this.dateTimeScopeOp[1], '早班/morning Shift/Ранняя смена')
          // 进行相关数据赋值(早班）
          for (let i = 0; i < generateMorning.length; i++) {
            // 筛选，计算每天出现的数量
            let excOpNumb = exceptionMorningData.filter(item => {
              const excDate = new Date(item.excDate);
              const startDate = new Date(generateMorning[i].start);
              const endDate = new Date(generateMorning[i].end);
              return excDate >= startDate && excDate <= endDate;
            });
            //给数据赋值
            chartStationNubOp.series[1].data.push(excOpNumb.length.toString())
          }

          //画出故障总的趋势图,画出早班的报警信息，进行赋值，先得到每天的时间数组
          //进行相关数据赋值（中班）
          let generateMiddle = this.generateDateRange(this.dateTimeScopeOp[0], this.dateTimeScopeOp[1], '中班/middle shift/Средний класс')
          // 进行相关数据赋值(全部数据）
          for (let i = 0; i < generateMiddle.length; i++) {
            // 筛选，计算每天出现的数量
            let excOpNumb = exceptionMorningData.filter(item => {
              const excDate = new Date(item.excDate);
              const startDate = new Date(generateMiddle[i].start);
              const endDate = new Date(generateMiddle[i].end);
              return excDate >= startDate && excDate <= endDate;
            });
            //给数据赋值
            chartStationNubOp.series[2].data.push(excOpNumb.length.toString())
          }
          //画出图
          this.$nextTick(() => {
            if (!this.stationNubOp) {
              this.stationNubOp = echarts.init(this.$refs.stationNubOp);
            }
            this.stationNubOp.setOption(chartStationNubOp);
          });
        } else {
          this.$message.error('请选择工序')
        }
      });
    },
    //页面用到的变量：用户要查看那一序的报警信息，用在了报警的列表上
    opTypeList(newVal){
      if (newVal==='' || newVal===undefined || newVal===null){
        if (this.dateOneDay!=='' && this.dateOneDay!==undefined && this.dateOneDay!==null){
          if (this.shiftType!=='' && this.shiftType!==undefined && this.shiftType!==null){
            let timeTemp = []
            if (this.shiftType === '早班/morning Shift/Ранняя смена') {
              timeTemp = [this.dateOneDay + ' 13:20:00', this.dateOneDay + ' 22:20:00']
            } else if (this.shiftType === '中班/middle shift/Средний класс') {
              // 创建日期对象
              const date = new Date(this.dateOneDay);

              // 创建两个时间点
              const startTime = new Date(date);
              startTime.setHours(17, 20, 0);

              const endTime = new Date(date);
              endTime.setDate(endTime.getDate() + 1); // 增加一天
              endTime.setHours(2, 20, 0);

              // 格式化为字符串
              const formatDate = (d) => {
                const year = d.getFullYear();
                const month = String(d.getMonth() + 1).padStart(2, '0');
                const day = String(d.getDate()).padStart(2, '0');
                return `${year}-${month}-${day}`;
              };

              timeTemp = [
                `${formatDate(startTime)} ${'22:20:00'}`,
                `${formatDate(endTime)} ${'07:20:00'}`
              ];
            } else if (this.shiftType === '夜班/night shift/Ночная работа') {
              // 创建日期对象
              const date = new Date(this.dateOneDay);

              // 创建两个时间点
              const startTime = new Date(date);
              startTime.setHours(17, 20, 0);

              const endTime = new Date(date);
              endTime.setDate(endTime.getDate() + 1); // 增加一天
              endTime.setHours(2, 20, 0);

              // 格式化为字符串
              const formatDate = (d) => {
                const year = d.getFullYear();
                const month = String(d.getMonth() + 1).padStart(2, '0');
                const day = String(d.getDate()).padStart(2, '0');
                return `${year}-${month}-${day}`;
              };

              timeTemp = [
                `${formatDate(endTime)} ${'07:20:00'}`,
                `${formatDate(endTime)} ${'13:20:00'}`
              ];
            }
            if (timeTemp.length > 0) {
              this.exceptionData = []
              this.queryExceptionOneFiledScopeWorkExceptionRemoval('excDate', timeTemp[0], timeTemp[1]).then(data => {
                //根据用户选择的车间类型，对数据进行过滤掉
                let dataFil = []
                if (this.buttonDoe === 1) {
                  dataFil = data
                } else if (this.buttonDoe === 2) {
                  dataFil = data.filter(item => item.workShop === '装配车间/Assembly workshop/Цех сборки двигателей')
                }
                this.exceptionData = dataFil
              })
            }
          }
        }
      }
      else {
        if (this.exceptionData.length>0){
          this.exceptionData=this.exceptionData.filter(item=>item.op===newVal)
        }
      }
    },
    //监视用户对查看车间的变化
    buttonDoe(newVal) {
      //是所有的项目
      if (newVal === 1) {
        //赋值一下
        let temp
        temp = _.cloneDeep(this.dateTimeScope)
        this.dateTimeScope = temp
      } else if (newVal === 2) {
        //赋值一下
        let temp
        temp = _.cloneDeep(this.dateTimeScope)
        this.dateTimeScope = temp
        temp = _.cloneDeep(this.dateOneDay)
        this.dateOneDay = temp
        temp = _.cloneDeep(this.shiftType)
        this.shiftType = temp
        temp = _.cloneDeep(this.dateTimeScopeOp)
        this.dateTimeScopeOp = temp
      } else if (newVal === 3) {
        //赋值一下
        let temp
        temp = _.cloneDeep(this.dateTimeScope)
        this.dateTimeScope = temp
      } else if (newVal === 4) {
        //赋值一下
        let temp
        temp = _.cloneDeep(this.dateTimeScope)
        this.dateTimeScope = temp
      }
    }
  },
  methods: {
    //退出登录
    logOut() {
      localStorage.removeItem('u_token');
      localStorage.removeItem('userName')
      this.$router.push('UserLogin')
    },
    //通用，语言选择
    chooseLanguage(language) {
      this.languageS = language
      if (language === 'chinese') {
        //main
        this.main.qualityManagementSystem = '俄动力质量管理系统'
        this.main.alarmRelease = '报警/故障解除业务'
        this.main.allSteps = '所有环节'
        this.main.assemblyWorkshop = '装配车间'
        this.main.machiningWorkshop = '机加车间'
        this.main.otherSteps = '其他环节'
        //pageVal
        this.pageVal.alarmProblemList = '报警/故障问题清单'
        this.pageVal.shiftFilter = '班次筛选：'
        this.pageVal.selectDate = '选择日期'
        this.pageVal.select = '请选择'
        this.pageVal.timeFilter = '时间筛选：'
        this.pageVal.to = '至'
        this.pageVal.startTime = '开始时间'
        this.pageVal.endTime = '结束时间'
        this.pageVal.add = '添加'
        this.pageVal.otherInformation = '其他信息：'
        this.pageVal.downtime = '停机时间：'
        this.pageVal.lineStopTime = '停线时间：'
        this.pageVal.caller = '报警人：'
        this.pageVal.releasePerson = '解除人：'
        this.pageVal.recoveryType = '恢复类型：'
        this.pageVal.op = '工序号'
        this.pageVal.alarmInformation = '报警信息'
        this.pageVal.engineNumber = '发动机号'
        this.pageVal.alarmTime = '报警时间(北京)'
        this.pageVal.isQualified = '是否合格'
        this.pageVal.problemProgress = '问题进度'
        this.pageVal.unfinishedQuestions = '未结题'
        this.pageVal.closedQuestions = '已结题'
        this.pageVal.pending = '挂起'
        this.pageVal.edit = '编辑'

        this.pageVal.alarmAnalysis = '报警/故障分析'
        this.pageVal.alarmQuantity = '选择范围各工序报警数量：'
        this.pageVal.alarmReleasedQuantity = '选择范围各工序报警解除完成数量：'
        this.pageVal.alarmTrendChart = '各工序报警趋势图：'

        this.pageVal.alarmTypeList = '报警/故障类型清单'

        this.pageVal.modelSpecification = '模型说明'

        //dialog
        this.pageVal.workshop = '车间名称'
        this.pageVal.line = '线体名称'
        this.pageVal.feedbackPerson = '反馈人'
        this.pageVal.occurrenceTime = '发生时间'
        this.pageVal.enter = '请输入内容'
        this.pageVal.ok = '确定'
        this.pageVal.cancel = '取消'
        this.pageVal.isOk = '是否合格'
        this.pageVal.restoration = '恢复类型'

      } else if (language === 'english') {
        //main
        this.main.qualityManagementSystem = 'Quality Management System'
        this.main.alarmRelease = 'Alarm/Fault Release'
        this.main.allSteps = 'All Steps'
        this.main.assemblyWorkshop = 'Assembly Workshop'
        this.main.machiningWorkshop = 'Machining Workshop'
        this.main.otherSteps = 'Other Steps'
        //pageVal
        this.pageVal.alarmProblemList = 'Alarm/Fault Problem List'
        this.pageVal.shiftFilter = 'Shift Filter:'
        this.pageVal.selectDate = 'Select Date'
        this.pageVal.select = 'Select'
        this.pageVal.timeFilter = 'Time Filter:'
        this.pageVal.to = 'To'
        this.pageVal.startTime = 'Start Time'
        this.pageVal.endTime = 'End Time'
        this.pageVal.add = 'Add'
        this.pageVal.otherInformation = 'Other Information:'
        this.pageVal.downtime = 'Downtime:'
        this.pageVal.lineStopTime = 'Line Stop Time:'
        this.pageVal.caller = 'Alarm Caller:'
        this.pageVal.releasePerson = 'Alarm Released by:'
        this.pageVal.recoveryType = 'Recovery Type:'
        this.pageVal.op = 'OP'
        this.pageVal.alarmInformation = 'Alarm Information'
        this.pageVal.engineNumber = 'Engine Number'
        this.pageVal.alarmTime = 'Alarm Time(Beijing)'
        this.pageVal.isQualified = 'Is the product qualified?'
        this.pageVal.problemProgress = 'Problem Progress'
        this.pageVal.unfinishedQuestions = 'Unfinished Questions'
        this.pageVal.closedQuestions = 'Closed Questions'
        this.pageVal.pending = 'Pending'
        this.pageVal.edit = 'Edit'

        this.pageVal.alarmAnalysis = 'Alarm/Fault Analysis'
        this.pageVal.alarmQuantity = 'Number of alarms for each process within the selected range:'
        this.pageVal.alarmReleasedQuantity = 'Number of completed alarm releases for each process within the selected range:'
        this.pageVal.alarmTrendChart = 'Trend chart of alarms for each process:'

        this.pageVal.alarmTypeList = 'Alarm/Fault Type List'

        this.pageVal.modelSpecification = 'Model Specification'

        //dialog
        this.pageVal.workshop = 'Workshop'
        this.pageVal.line = 'Line'
        this.pageVal.feedbackPerson = 'Feedback Person'
        this.pageVal.occurrenceTime = 'Occurrence Time'
        this.pageVal.enter = 'Enter'
        this.pageVal.ok = 'OK'
        this.pageVal.cancel = 'Cancel'
        this.pageVal.isOk = 'Qualified Or Not'
        this.pageVal.restoration = 'Recovery Type'
      } else if (language === 'russian') {
        //main
        this.main.qualityManagementSystem = 'Система управления качеством'
        this.main.alarmRelease = 'Сигнализация/ Выпуск неисправности'
        this.main.allSteps = 'Все шаги'
        this.main.assemblyWorkshop = 'Сборочная линия'
        this.main.machiningWorkshop = 'Обработки линия'
        this.main.otherSteps = 'Другие шаги'
        //pageVal
        this.pageVal.alarmProblemList = 'Список проблем тревоги'
        this.pageVal.shiftFilter = 'Фильтр смены:'
        this.pageVal.selectDate = 'Выберите дату'
        this.pageVal.select = 'Выбрать'
        this.pageVal.timeFilter = 'Фильтр времени:'
        this.pageVal.to = 'До'
        this.pageVal.startTime = 'Время начала'
        this.pageVal.endTime = 'Конечное время'
        this.pageVal.add = 'Добавить'
        this.pageVal.otherInformation = 'Другая информация:'
        this.pageVal.downtime = 'Время простоя:'
        this.pageVal.lineStopTime = 'Время остановки линии:'
        this.pageVal.caller = 'Звонец тревоги:'
        this.pageVal.releasePerson = 'Сигнализация выпущена:'
        this.pageVal.recoveryType = 'Тип восстановления:'
        this.pageVal.op = 'Номер операции'
        this.pageVal.alarmInformation = 'Информация о тревоге'
        this.pageVal.engineNumber = 'Номер двигателя'
        this.pageVal.alarmTime = 'Время тревоги (Пекин)'
        this.pageVal.isQualified = 'Соответствует ли продукция требованиям?'
        this.pageVal.problemProgress = 'Прогресс проблемы'
        this.pageVal.unfinishedQuestions = 'Незавершенные вопросы'
        this.pageVal.closedQuestions = 'Закрытые вопросы'
        this.pageVal.pending = 'Ожидается'
        this.pageVal.edit = 'Редактировать'

        this.pageVal.alarmAnalysis = 'Анализ тревоги'
        this.pageVal.alarmQuantity = 'Количество сигналов тревоги для каждого процесса в выбранном диапазоне:'
        this.pageVal.alarmReleasedQuantity = 'Количество завершенных тревог для каждого процесса в выбранном диапазоне:'
        this.pageVal.alarmTrendChart = 'Тенденциальная диаграмма тревог для каждого процесса:'

        this.pageVal.alarmTypeList = 'Список типа сигнализации'

        this.pageVal.modelSpecification = 'Спецификация модели'

        //dialog
        this.pageVal.workshop = 'Цех'
        this.pageVal.line = 'Линия'
        this.pageVal.feedbackPerson = 'Обратная связь Человек'
        this.pageVal.occurrenceTime = 'Время возникновения'
        this.pageVal.enter = 'Введите'
        this.pageVal.ok = 'OK'
        this.pageVal.cancel = 'Отмена'
        this.pageVal.isOk = 'Прошло ли испытание'
        this.pageVal.restoration = 'Тип восстановления'
      }
    },
    //查询用户信息的函数
    inquiry() {
      //输入用户编号，向后端查询信息
      const useId = localStorage.getItem('userName').replace(/"/g, '');
      this.$request.post('/useQueryPower', {
        queryFiledName: 'workExceptionRemoval',
        userId: useId,
      }).then(result => {
        if (result.code === 401) {
          this.$router.push('UserLogin')
          alert("您未登录，请登录")
        } else {
          this.useName = result.data.name
          this.usePower = result.data.changeModel
          this.useId = useId
        }
      })
    },
    // 通用，弹窗关闭的时候
    //通用：误关闭弹窗的确认函数(中英俄)
    getI18nText(key) {
      const i18nMessages = {
        chinese: {
          confirmClose: '确认关闭？',
          confirmButton: '确定',
          cancelButton: '取消',
        },
        english: {
          confirmClose: 'Sure to close?',
          confirmButton: 'OK',
          cancelButton: 'Cancel',
        },
        russian: {
          confirmClose: 'Уверен в закрытии?',
          confirmButton: 'Подтвердить',
          cancelButton: 'Отмена',
        },
      };
      return i18nMessages[this.languageS]?.[key] ?? i18nMessages.chinese[key];
    },
    handleClose(done) {
      this.$confirm(
          this.getI18nText('confirmClose'), // 消息内容
          {
            confirmButtonText: this.getI18nText('confirmButton'), // 确认按钮
            cancelButtonText: this.getI18nText('cancelButton'),    // 取消按钮
          }
      )
          .then(() => done())
          .catch(() => {
          });
    },
    //在tab控件上单击的函数
    handleClick(tab, event) {
      console.log(tab, event);
      if (this.activeName === 'exception') {
        this.$nextTick(() => {
          // 如果需要对数据进行深拷贝来触发更新，可以考虑如下方式
          this.exceptionData = _.cloneDeep(this.exceptionData);
        })
      }
      else if (this.activeName==='exceptionAnalysis'){
        //需要重新筛选数据，为第一个图做准备，这次直接把工序清零
        this.opTypeList=''
        this.dateOneDayChange(this.dateOneDay)
      }
      else if (this.activeName === 'alarmList') {
        //当点击名称为alarmList（网页中名字为报警类型清单）时，发送post至后端，并处理接收到的结果
        this.$request.post('/selectAllPlcAlarmSettingWorkException').then(result => {
          this.plcAlarmSettingData = result.data
        })
      }
    },
    //选择主导航上的不同按钮
    buttonMainSelect(doe) {
      this.buttonDoe = doe
      if (doe === 1) {
        this.buttonBackColor1 = 'blue'//按钮的背景颜色
        this.buttonColor1 = 'white'//按钮的字体颜色
        this.buttonBackColor2 = ''//按钮的背景颜色
        this.buttonColor2 = ''//按钮的字体颜色
        this.buttonBackColor3 = ''//按钮的背景颜色
        this.buttonColor3 = ''//按钮的字体颜色
        this.buttonBackColor4 = ''//按钮的背景颜色
        this.buttonColor4 = ''//按钮的字体颜色
      }
      if (doe === 2) {
        this.buttonBackColor1 = ''//按钮的背景颜色
        this.buttonColor1 = ''//按钮的字体颜色
        this.buttonBackColor2 = 'blue'//按钮的背景颜色
        this.buttonColor2 = 'white'//按钮的字体颜色
        this.buttonBackColor3 = ''//按钮的背景颜色
        this.buttonColor3 = ''//按钮的字体颜色
        this.buttonBackColor4 = ''//按钮的背景颜色
        this.buttonColor4 = ''//按钮的字体颜色
      }
      if (doe === 3) {
        this.buttonBackColor1 = ''//按钮的背景颜色
        this.buttonColor1 = ''//按钮的字体颜色
        this.buttonBackColor2 = ''//按钮的背景颜色
        this.buttonColor2 = ''//按钮的字体颜色
        this.buttonBackColor3 = 'blue'//按钮的背景颜色
        this.buttonColor3 = 'white'//按钮的字体颜色
        this.buttonBackColor4 = ''//按钮的背景颜色
        this.buttonColor4 = ''//按钮的字体颜色
      }
      if (doe === 4) {
        this.buttonBackColor1 = ''//按钮的背景颜色
        this.buttonColor1 = ''//按钮的字体颜色
        this.buttonBackColor2 = ''//按钮的背景颜色
        this.buttonColor2 = ''//按钮的字体颜色
        this.buttonBackColor3 = ''//按钮的背景颜色
        this.buttonColor3 = ''//按钮的字体颜色
        this.buttonBackColor4 = 'blue'//按钮的背景颜色
        this.buttonColor4 = 'white'//按钮的字体颜色
      }
    },
    //电脑端增加一条报警/异常记录的显示函数 1：新增；2：编辑；3：删除；
    editExceptionShow(doe, copse) {
      this.exceptionDataScope = copse
      this.exceptionDoe = doe
      //是新增一个设备异常/报警
      if (doe === 1) {
        this.disabledEdit = false
        this.exceptionForm = {
          id: null,//主键
          establishTime: '',//创建时间
          updateTime: '',//修改时间
          deleteSign: 1,//删除标记
          editName: this.useName + '/' + this.useId,//编辑人
          workShop: '',//车间名称，三种语言
          lineName: '',//线体名称
          op: '',//工序号
          excMessage: '',//报警信息
          excDate: '',//报警时间
          excPersonName: this.useName,//报警反馈人
          excType: 0,//报警类别
          isProblem: -1,
          downTimeOp: 0,
          downTimeLine: 0,
        }
        if (this.languageS === 'chinese') {
          this.titleUse = '新增一项异常/报警信息'
        } else if (this.languageS === 'english') {
          this.titleUse = 'Add an alarm/fault message'
        } else if (this.languageS === 'russian') {
          this.titleUse = 'Добавить сигнал предупреждения'
        }
        this.exceptionDialog = true
      }
      //是编辑一个设备异常/报警
      else if (doe === 2) {
        this.disabledEdit = false
        this.exceptionForm = _.cloneDeep(copse.row)
        this.exceptionDialog = true
      } else if (doe === 4) {
        //是要在电脑上进行报警解除等级
        this.disabledEdit = true
        this.exceptionForm = _.cloneDeep(copse.row)
        this.exceptionDialog = true
      }
    },
    //编辑、新增报警、异常信息，点击确定提交按钮
    exceptionEdit() {
      console.log('到这里了')
      //判断数据
      if (this.exceptionForm.workShop === null || this.exceptionForm.workShop === undefined || this.exceptionForm.workShop === '') {
        this.$message.error('请选择车间名称')
        return
      } else if (this.exceptionForm.lineName === null || this.exceptionForm.lineName === undefined || this.exceptionForm.lineName === '') {
        this.$message.error('请选择线体名称')
        return;
      } else if (this.exceptionForm.op === null || this.exceptionForm.op === undefined || this.exceptionForm.op === '') {
        this.$message.error('请选择工序号')
        return;
      } else if (this.exceptionForm.excDate === null || this.exceptionForm.excDate === undefined || this.exceptionForm.excDate === '') {
        this.$message.error('请选择发生日期')
        return;
      } else if (this.exceptionForm.excPersonName === null || this.exceptionForm.excPersonName === undefined || this.exceptionForm.excPersonName === '') {
        this.$message.error('请输入反馈人')
        return;
      }
      //组合数据
      this.exceptionForm.editName = this.useName + '/' + this.useId
      //向后端发送信息，是新增
      if (this.exceptionDoe === 1) {
        //组合数据，把报警时间更改为date格式
        this.exceptionForm.excDate.replace(' ', 'T');
        this.exceptionForm.excDate = new Date(this.exceptionForm.excDate)
        this.$request.post('excInsertWorkExceptionRemoval', this.exceptionForm).then(result => {
          if (result.code === 401) {
            this.$router.push('UserLogin')
            alert("您未登录，请登录")
          } else {
            if (result.data === '' || result.data === null || result.data === undefined) {
              this.$message.error('信息错误，请联系管理员')

            } else {
              this.exceptionData = result.data
              this.exceptionDialog = false
            }
          }
        })
      }
      //向后端发送信息，是修改
      if (this.exceptionDoe === 2 || this.exceptionDoe===4) {
        //组合数据，把报警时间更改为date格式
        this.exceptionForm.excDate.replace(' ', 'T');
        this.exceptionForm.excDate = new Date(this.exceptionForm.excDate)
        this.exceptionForm.editName = this.useName + '/' + this.useId
        if (this.exceptionDoe===4){
          this.exceptionForm.liftName=this.useId
        }
        //向后端传输数据，修改一行报警信息
        this.$request.post('excEditOneRowWorkExceptionRemoval', this.exceptionForm).then(result => {
          if (result.code === 401) {
            this.$router.push('UserLogin')
            alert("您未登录，请登录")
          } else {
            if (result.data === '' || result.data === null || result.data === undefined) {
              this.$message.error('信息错误，请联系管理员')

            } else {
              this.$message.success('修改成功')
              this.exceptionData.splice(this.exceptionDataScope.$index, 1, this.exceptionForm)
              this.exceptionDialog = false
            }
          }
        })
      }
    },
    //辅助函数：对报警/异常信息表中，对一个日期类型的数据，筛选≥某一个值，和＜某一个值，
    queryExceptionOneFiledScopeWorkExceptionRemoval(filedName, minVal, maxVal) {
      return new Promise((resolve, reject) => {
        this.$request.post('/queryExceptionOneFiledScopeWorkExceptionRemoval', {
          filedName: filedName,
          minVal: minVal,
          maxVal: maxVal
        }).then(result => {
          if (result.code === 401) {
            this.$router.push('UserLogin');
            alert("您未登录，请登录");
            reject("未登录"); // 返回错误信息
          } else {
            resolve(result.data); // 返回数据
          }
        }).catch(error => {
          reject(error); // 捕获请求错误
        });
      });
    },
    // 获取当前时间
    getCurrentTimeInBeijing() {
      const now = new Date();

      // 格式化日期和时间
      const year = now.getFullYear();
      const month = String(now.getMonth() + 1).padStart(2, '0');
      const day = String(now.getDate()).padStart(2, '0');
      const hours = String(now.getHours()).padStart(2, '0');
      const minutes = String(now.getMinutes()).padStart(2, '0');
      const seconds = String(now.getSeconds()).padStart(2, '0');

      // 格式化为 yyyy-MM-dd HH:mm:ss
      return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
    },
    // 创建时间数组
    createTimeArray() {
      const beijingTime = this.getCurrentTimeInBeijing();
      // 提取年月日
      const [year, month, day] = beijingTime.split(' ')[0].split('-');

      // 创建时间数组
      return [
        `${year}-${month}-${day} 08:20:00`,
        `${year}-${month}-${day} 17:20:00`
      ];
    },
    // 创建时间数组，一个月周期的,用户输入一个字符串的日期，输入一个需要计算的天数，输入一个itme，是一个时间格式，‘HH：mm：ss’，最后得到一个数组，是用户输入的时间，和计算后的时间，是日期、时间的字符串格式，小的放在前面，大的放在后面；
    createTimeArrayOneMonthly(date, day, time) {
      let dateTime = new Date(date);
      // 创建新的日期对象，避免修改原日期
      let newDateTime = new Date(dateTime);
      // 正确减去天数
      newDateTime.setDate(newDateTime.getDate() - day);

      // 格式化日期和时间
      const formatDateTime = (dt) => {
        const year = dt.getFullYear();
        const month = String(dt.getMonth() + 1).padStart(2, '0');
        const day = String(dt.getDate()).padStart(2, '0');
        return `${year}-${month}-${day} ${time}`;
      };

      return [
        formatDateTime(newDateTime),
        formatDateTime(dateTime),

      ];
    },
    //输入日期区间，以及班次，返回得到这个班次的时间区间数组
    generateDateRange(startDateStr, endDateStr, shift) {
      // 将输入的日期字符串转换为Date对象
      const startDate = new Date(startDateStr);
      const endDate = new Date(endDateStr);
      // 验证日期是否有效
      if (isNaN(startDate.getTime()) || isNaN(endDate.getTime())) {
        throw new Error('Invalid date format');
      }

      // 初始化结果数组
      const dateArray = [];

      // 循环生成日期
      let currentDate = new Date(startDate);
      currentDate.setDate(currentDate.getDate() + 1); // 设置为 startDate 的下一天

      // 创建结束日期的后两天的Date对象
      const endDatePlusTwo = new Date(endDate);
      endDatePlusTwo.setDate(endDate.getDate() + 2);

      while (currentDate <= endDatePlusTwo) {
        // 格式化日期为 YYYY-MM-DD
        const formattedDate = currentDate.toISOString().split('T')[0];
        dateArray.push(formattedDate);

        // 增加一天
        currentDate.setDate(currentDate.getDate() + 1);
      }

      let dateArrayShift = [];
      if (shift === '' || shift === null || shift === undefined) {
        for (let i = 0; i < dateArray.length - 1; i++) {
          let temp = {start: dateArray[i] + ' 13:20:00', end: dateArray[i + 1] + ' 13:20:00'};
          dateArrayShift.push(temp);
        }
      } else if (shift === '早班/morning Shift/Ранняя смена') {
        for (let i = 0; i < dateArray.length; i++) {
          let temp = {start: dateArray[i] + ' 13:20:00', end: dateArray[i] + ' 22:20:00'};
          dateArrayShift.push(temp);
        }
      } else if (shift === '中班/middle shift/Средний класс') {
        for (let i = 0; i < dateArray.length - 1; i++) {
          let temp = {start: dateArray[i] + ' 22:20:00', end: dateArray[i + 1] + ' 07:20:00'};
          dateArrayShift.push(temp);
        }
      } else if (shift === '夜班/night shift/Ночная работа') {
        for (let i = 0; i < dateArray.length - 1; i++) {
          let temp = {start: dateArray[i + 1] + ' 07:20:00', end: dateArray[i + 1] + ' 13:20:00'};
          dateArrayShift.push(temp);
        }
      }
      return dateArrayShift;
    },
    //点击修改报警基础信息表的显示函数
    plcAlarmSettingEditShow(doe, scope) {
      console.log(doe, scope)
      this.titleUse = '修改报警信息'
      this.plcAlarmSettingFrom = _.cloneDeep(scope.row)
      this.plcAlarmSettingScope = scope
      this.plcAlarmSettingDialog = true
    },
    //点击修改报警基础信息表的确定按钮
    plcAlarmSettingEditOk() {
      console.log(this.plcAlarmSettingFrom)
      if (this.plcAlarmSettingFrom.alarmInformationChinese === '' || this.plcAlarmSettingFrom.alarmInformationChinese === undefined || this.plcAlarmSettingFrom.alarmInformationChinese === null) {
        this.$message.error('中文报警信息未输入')
        return
      } else if (this.plcAlarmSettingFrom.alarmInformationRussian === '' || this.plcAlarmSettingFrom.alarmInformationRussian === undefined || this.plcAlarmSettingFrom.alarmInformationRussian === null) {
        this.$message.error('俄文报警信息未输入')
        return
      } else if (this.plcAlarmSettingFrom.alarmLevel === '' || this.plcAlarmSettingFrom.alarmLevel === undefined || this.plcAlarmSettingFrom.alarmLevel === null) {
        this.$message.error('报警等级信息未输入')
        return
      }

      this.$request.post('/editOneByIdPlcAlarmSettingWorkException', this.plcAlarmSettingFrom).then(result => {
        if (result.code === 401) {
          this.$router.push('UserLogin')
          alert("您未登录，请登录")
        } else {
          this.plcAlarmSettingData.splice(this.plcAlarmSettingScope.$index, 1, this.plcAlarmSettingFrom)
          this.plcAlarmSettingDialog = false
          this.$message.info(result.data)
        }
      })
    },
    //用户选择不同的日期，班次，去筛选信息
    dateOneDayChange(newVal){
      let timeTemp = []
      if (this.shiftType === '早班/morning Shift/Ранняя смена') {
        timeTemp = [this.dateOneDay + ' 13:20:00', this.dateOneDay + ' 22:20:00']
      } else if (this.shiftType === '中班/middle shift/Средний класс') {
        // 创建日期对象
        const date = new Date(newVal);

        // 创建两个时间点
        const startTime = new Date(date);
        startTime.setHours(17, 20, 0);

        const endTime = new Date(date);
        endTime.setDate(endTime.getDate() + 1); // 增加一天
        endTime.setHours(2, 20, 0);

        // 格式化为字符串
        const formatDate = (d) => {
          const year = d.getFullYear();
          const month = String(d.getMonth() + 1).padStart(2, '0');
          const day = String(d.getDate()).padStart(2, '0');
          return `${year}-${month}-${day}`;
        };

        timeTemp = [
          `${formatDate(startTime)} ${'22:20:00'}`,
          `${formatDate(endTime)} ${'07:20:00'}`
        ];
      } else if (this.shiftType === '夜班/night shift/Ночная работа') {
        // 创建日期对象
        const date = new Date(newVal);

        // 创建两个时间点
        const startTime = new Date(date);
        startTime.setHours(17, 20, 0);

        const endTime = new Date(date);
        endTime.setDate(endTime.getDate() + 1); // 增加一天
        endTime.setHours(2, 20, 0);

        // 格式化为字符串
        const formatDate = (d) => {
          const year = d.getFullYear();
          const month = String(d.getMonth() + 1).padStart(2, '0');
          const day = String(d.getDate()).padStart(2, '0');
          return `${year}-${month}-${day}`;
        };

        timeTemp = [
          `${formatDate(endTime)} ${'07:20:00'}`,
          `${formatDate(endTime)} ${'13:20:00'}`
        ];
      }
      if (timeTemp.length > 0) {
        //筛选，得到这段时间内的报警数据
        this.exceptionData = []
        this.queryExceptionOneFiledScopeWorkExceptionRemoval('excDate', timeTemp[0], timeTemp[1]).then(data => {
          //根据用户选择的车间类型，对数据进行过滤掉
          let dataFil = []
          if (this.buttonDoe === 1) {
            dataFil = data
          } else if (this.buttonDoe === 2) {
            dataFil = data.filter(item => item.workShop === '装配车间/Assembly workshop/Цех сборки двигателей')
          }
          if (this.opTypeList==='' || this.opTypeList===undefined || this.opTypeList===null){
            this.exceptionData = dataFil
            console.log('工序为空')
          }
          else {
            this.exceptionData =dataFil.filter(item=>item.op===this.opTypeList)
            console.log('工序不为空')
            console.log(dataFil,this.opTypeList)

          }
          this.dateTimeScope = timeTemp

          //建立一个变量，准备画图，画的是当班次按照工序出现的报警数量统计
          let chartStationNub = {
            title: {
              textStyle: {
                color: '#333',
                fontSize: 14
              },
              x: 'center',
              text: this.dateOneDay + '——' + this.shiftType + '报警数量趋势图',
            },
            xAxis: {
              type: 'category',
              data: [],
              axisLabel: {
                rotate: 45,
                fontSize: 11
              }
            },
            yAxis: {
              type: 'value',
              min: 0,
              max: 10,
              axisLabel: {
                formatter: '{value}'
              }
            },
            series: [
              {
                name: '故障数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#1890ff'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              }
            ],
            grid: {
              top: '6%',
              left: '3%',
              right: '4%',
              bottom: '0%',
              containLabel: true
            },
            tooltip: {
              trigger: 'axis',
              axisPointer: {
                type: 'cross',
                label: {
                  backgroundColor: '#6a7985'
                }
              }
            },
            legend: {
              data: ['数量'],
              left: 'right',
              top: '0%',
              itemGap: 20,
              textStyle: {
                color: '#333',
                fontSize: 11
              }
            },
            toolbox: {
              feature: {
                saveAsImage: {
                  type: 'png',
                  name: '报警数量趋势图',
                  title: '',
                  pixelRatio: 2,
                  backgroundColor: '#fff',
                  excludeComponents: ['toolbox']
                },
                myCopy: {
                  show: true,
                  title: '',
                  icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                  onclick: async () => {
                    if (!this.stationNub) {
                      alert('图表未初始化');
                      return;
                    }
                    // 清除选中状态
                    this.stationNub.dispatchAction({
                      type: 'unselect',
                      seriesIndex: 0
                    });

                    const dataUrl = this.stationNub.getDataURL({
                      type: 'png',
                      pixelRatio: 2,
                      backgroundColor: '#fff'
                    });

                    try {
                      // 将 DataURL 转换为 Blob
                      const response = await fetch(dataUrl);
                      const blob = await response.blob();

                      // 使用 Clipboard API 复制图片
                      await navigator.clipboard.write([
                        new ClipboardItem({
                          [blob.type]: blob
                        })
                      ]);
                      this.$message.success('已复制');
                    } catch (err) {
                      this.$message.success('复制失败');
                    }
                  }
                }
              },
              right: '0%',
              top: '90%',
              itemSize: 14,
              itemGap: 10,
              textStyle: {
                fontSize: 11
              },
              iconStyle: {
                borderColor: '#666',
                borderWidth: 1,
                backgroundColor: '#f5f5f5'
              }
            }
          }
          //建立一个变量，画出是否解除的趋势图，
          let stationNubFinish = {
            title: {
              textStyle: {
                color: '#333',
                fontSize: 14
              },
              x: 'center',
              text: this.dateOneDay + '——' + this.shiftType + '报警数量趋势图',
            },
            xAxis: {
              type: 'category',
              data: [],
              axisLabel: {
                rotate: 45,
                fontSize: 11
              }
            },
            yAxis: {
              type: 'value',
              min: 0,
              max: 10,
              axisLabel: {
                formatter: '{value}'
              }
            },
            series: [
              {
                name: '全天数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#1890ff'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
              {
                name: '记录数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#5470C6'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
              {
                name: '未记录数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#91CC75'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
            ],
            grid: {
              top: '6%',
              left: '3%',
              right: '4%',
              bottom: '0%',
              containLabel: true
            },
            tooltip: {
              trigger: 'axis',
              axisPointer: {
                type: 'cross',
                label: {
                  backgroundColor: '#6a7985'
                }
              }
            },
            legend: {
              data: ['全天数量', '记录数量', '未记录数量'],
              left: 'right',
              orient: 'vertical',
              top: '5%',
              itemGap: 20,
              textStyle: {
                color: '#333',
                fontSize: 11
              },
              selected: {
                '全天数量': true,
                '记录数量': true,
                '未记录数量': true
              },
              toolbox: {
                feature: {
                  saveAsImage: {
                    type: 'png',
                    name: '报警数量趋势图',
                    title: '',
                    pixelRatio: 2,
                    backgroundColor: '#fff',
                    excludeComponents: ['toolbox']
                  },
                  myCopy: {
                    show: true,
                    title: '',
                    icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                    onclick: async () => {
                      if (!this.stationNub) {
                        alert('图表未初始化');
                        return;
                      }
                      // 清除选中状态
                      this.stationNub.dispatchAction({
                        type: 'unselect',
                        seriesIndex: 0
                      });

                      const dataUrl = this.stationNub.getDataURL({
                        type: 'png',
                        pixelRatio: 2,
                        backgroundColor: '#fff'
                      });

                      try {
                        // 将 DataURL 转换为 Blob
                        const response = await fetch(dataUrl);
                        const blob = await response.blob();

                        // 使用 Clipboard API 复制图片
                        await navigator.clipboard.write([
                          new ClipboardItem({
                            [blob.type]: blob
                          })
                        ]);
                        this.$message.success('已复制');
                      } catch (err) {
                        this.$message.success('复制失败');
                      }
                    }
                  }
                },
                right: '0%',
                top: '90%',
                itemSize: 14,
                itemGap: 10,
                textStyle: {
                  fontSize: 11
                },
                iconStyle: {
                  borderColor: '#666',
                  borderWidth: 1,
                  backgroundColor: '#f5f5f5'
                }
              }

            },
          }
          //建立一个变量，画出各个部门需要解除报警的数量，已经记录的数量，未解除的数量
          let stationDepartment = {
            title: {
              textStyle: {
                color: '#333',
                fontSize: 14
              },
              x: 'center',
              text: '责任部门趋势图',
            },
            xAxis: {
              type: 'category',
              data: ['班长', '品技', '品检', 'MU'],
              axisLabel: {
                rotate: 45,
                fontSize: 11
              }
            },
            yAxis: {
              type: 'value',
              min: 0,
              max: 40,
              axisLabel: {
                formatter: '{value}'
              }
            },
            series: [
              {
                name: '总数',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#1890ff'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
              {
                name: '已记录',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#5470C6'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
              {
                name: '未记录',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#91CC75'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
            ],
            grid: {
              top: '6%',
              left: '3%',
              right: '4%',
              bottom: '0%',
              containLabel: true
            },
            tooltip: {
              trigger: 'axis',
              axisPointer: {
                type: 'cross',
                label: {
                  backgroundColor: '#6a7985'
                }
              }
            },
            legend: {
              data: ['总数', '已记录', '未记录',],
              left: 'right',
              orient: 'vertical',
              top: '5%',
              itemGap: 20,
              textStyle: {
                color: '#333',
                fontSize: 11
              },
              selected: {
                '全天数量': true,
                '记录数量': true,
                '未记录数量': true
              },
              toolbox: {
                feature: {
                  saveAsImage: {
                    type: 'png',
                    name: '报警数量趋势图',
                    title: '',
                    pixelRatio: 2,
                    backgroundColor: '#fff',
                    excludeComponents: ['toolbox']
                  },
                  myCopy: {
                    show: true,
                    title: '',
                    icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                    onclick: async () => {
                      if (!this.stationNub) {
                        alert('图表未初始化');
                        return;
                      }
                      // 清除选中状态
                      this.stationNub.dispatchAction({
                        type: 'unselect',
                        seriesIndex: 0
                      });

                      const dataUrl = this.stationNub.getDataURL({
                        type: 'png',
                        pixelRatio: 2,
                        backgroundColor: '#fff'
                      });

                      try {
                        // 将 DataURL 转换为 Blob
                        const response = await fetch(dataUrl);
                        const blob = await response.blob();

                        // 使用 Clipboard API 复制图片
                        await navigator.clipboard.write([
                          new ClipboardItem({
                            [blob.type]: blob
                          })
                        ]);
                        this.$message.success('已复制');
                      } catch (err) {
                        this.$message.success('复制失败');
                      }
                    }
                  }
                },
                right: '0%',
                top: '90%',
                itemSize: 14,
                itemGap: 10,
                textStyle: {
                  fontSize: 11
                },
                iconStyle: {
                  borderColor: '#666',
                  borderWidth: 1,
                  backgroundColor: '#f5f5f5'
                }
              }

            },
          }

          //画图表，画出这段时间各个工序报警的数量，需要校验，是有数据的时候画图
          if (this.exceptionData.length > 0) {
            // 用于存储op值的统计结果
            const opCountMap = {};
            // 遍历数组，统计每个op值的出现次数
            this.exceptionData.forEach(item => {
              const op = item.op;
              if (opCountMap[op]) {
                opCountMap[op]++;
              } else {
                opCountMap[op] = 1;
              }
            });
            // 将统计结果转换为所需的格式
            const result = Object.keys(opCountMap).map(op => ({
              op: op,
              nub: opCountMap[op]
            }));
            result.sort((a, b) => b.nub - a.nub);
            for (let i = 0; i < result.length; i++) {
              //添加横坐标：
              chartStationNub.xAxis.data.push(result[i].op)
              //添加纵坐标：
              chartStationNub.series[0].data.push(result[i].nub)
            }
            //给Y坐标赋值
            chartStationNub.yAxis.max = result[0].nub + 1
            //画出图像
            //进行画图，画出这段时间的趋势图
            this.$nextTick(() => {
              if (!this.stationNub) {
                this.stationNub = echarts.init(this.$refs.stationNub)
              }
              //画故障数量的趋势图
              this.stationNub.setOption(chartStationNub)
            })

            //画出故障报警的解除记录图，分为总数、已登记处理、未登记处理
            //借用上一个数据X轴、变量的总数值
            stationNubFinish.xAxis.data = chartStationNub.xAxis.data
            stationNubFinish.series[0].data = chartStationNub.series[0].data
            stationNubFinish.yAxis.max = chartStationNub.yAxis.max
            //循环，查每一个工序下的数据.
            for (let i = 0; i < stationNubFinish.xAxis.data.length; i++) {
              //筛选数据，并赋值
              let finish = data.filter(item => item.op === stationNubFinish.xAxis.data[i] && item.liftName === '')
              stationNubFinish.series[2].data.push(finish.length)
              let finishNo = data.filter(item => item.op === stationNubFinish.xAxis.data[i] && item.liftName !== '')
              stationNubFinish.series[1].data.push(finishNo.length)
            }
            this.$nextTick(() => {
              if (!this.stationNubFinish) {
                this.stationNubFinish = echarts.init(this.$refs.stationNubFinish);
              }
              this.stationNubFinish.setOption(stationNubFinish);
            });

            //画出各个部门负责的报警解除情况，含未记录、已记录
            //定义一个变量，在筛选班长后的数据中，找到报警等级为班长的记录，并对变量进行赋值
            let departmentTemp = this.exceptionData.filter(item => item.alarmLevel === '班长')
            //将筛选班长后得到当天所有的条数记录为图表中的总数
            stationDepartment.series[0].data.push(String(departmentTemp.length))
            //定义一个变量，存放班长未确认的总数，在筛选数据为空的数量
            let stationBZNo = departmentTemp.filter(item => item.liftName === '' || item.liftName === undefined || item.liftName === null)
            //将筛选后 班长确认的总数 - 筛选为空的总数 得到 已记录的总数 赋值给图表中已记录的数据
            stationDepartment.series[1].data.push(String(departmentTemp.length - stationBZNo.length))
            //将筛选后 筛选为空的总数，赋值给图表中未记录的数据
            stationDepartment.series[2].data.push(String(stationBZNo.length))

            //使用前面定义变量，记录筛选品技后的数据，
            console.log(this.exceptionData)
            departmentTemp = this.exceptionData.filter(item => item.alarmLevel === '品技')
            //将筛选品检后得到当天所有的条数记录为图表中的总数
            stationDepartment.series[0].data.push(String(departmentTemp.length))
            //定义一个变量，存放品检未确认的总数，再筛选数据为空的数量
            let stationPINJIANNo = departmentTemp.filter(item => item.liftName === '' || item.liftName === undefined || item.liftName === null)
            //将筛选后 品检确认的总数 - 筛选为空的总数 得到 已记录的总数 赋值给图表中已记录的数据
            stationDepartment.series[1].data.push(String(departmentTemp.length - stationPINJIANNo.length))
            //将筛选后 筛选为空的总数，赋值给图表中未记录的数据
            stationDepartment.series[2].data.push(String(stationPINJIANNo.length))

            //使用前面定义变量，记录筛选品技后的数据，
            departmentTemp = this.exceptionData.filter(item => item.alarmLevel === '品检')
            //将筛选品检后得到当天所有的条数记录为图表中的总数
            stationDepartment.series[0].data.push(String(departmentTemp.length))
            //定义一个变量，存放品检未确认的总数，在筛选数据为空的数量
            let stationPINJINo = departmentTemp.filter(item => item.liftName === '' || item.liftName === undefined || item.liftName === null)
            //将筛选后 品检确认的总数 - 筛选为空的总数 得到 已记录的总数 赋值给图表中已记录的数据
            stationDepartment.series[1].data.push(String(departmentTemp.length - stationPINJINo.length))
            //将筛选后 筛选为空的总数，赋值给图表中未记录的数据
            stationDepartment.series[2].data.push(String(stationPINJINo.length))

            //使用前面定义变量，记录筛选品技后的数据，
            departmentTemp = this.exceptionData.filter(item => item.alarmLevel === '设备')
            //将筛选品检后得到当天所有的条数记录为图表中的总数
            stationDepartment.series[0].data.push(String(departmentTemp.length))
            //定义一个变量，存放品检未确认的总数，在筛选数据为空的数量
            let stationMUNo = departmentTemp.filter(item => item.liftName === '' || item.liftName === undefined || item.liftName === null)
            //将筛选后 品检确认的总数 - 筛选为空的总数 得到 已记录的总数 赋值给图表中已记录的数据
            stationDepartment.series[1].data.push(String(departmentTemp.length - stationMUNo.length))
            //将筛选后 筛选为空的总数，赋值给图表中未记录的数据
            stationDepartment.series[2].data.push(String(stationMUNo.length))
            //
            stationDepartment.yAxis.max = String(Math.round(this.exceptionData.length * 1.05))


            this.$nextTick(() => {
              if (!this.stationDepartment) {
                this.stationDepartment = echarts.init(this.$refs.stationDepartment);
              }
              this.stationDepartment.setOption(stationDepartment);
            });
          }
          else {
            chartStationNub = {
              title: {
                textStyle: {
                  color: '#333',
                  fontSize: 14
                },
                x: 'center',
                text: this.dateOneDay + '——' + this.shiftType + '趋势图',
              },
              xAxis: {
                type: 'category',
                data: [],
                axisLabel: {
                  rotate: 45,
                  fontSize: 11 // 添加字体大小设置
                }
              },
              yAxis: {
                type: 'value',
                min: 0,
                max: 10,
                axisLabel: {
                  formatter: '{value}'
                }
              },
              series: [
                {
                  name: '故障数量',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#1890ff' // 将颜色改为青蓝色
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true, // 显示标签
                    position: 'top', // 标签显示在柱子上方
                    color: '#333', // 标签文字颜色
                    fontSize: 11, // 标签文字大小
                    formatter: '{c}' // 显示数据值
                  }
                }
              ],
              grid: {
                top: '6%',    // 为标题和图例留出空间
                left: '3%',
                right: '4%',
                bottom: '0%',
                containLabel: true
              },
              tooltip: {
                trigger: 'axis',
                axisPointer: {
                  type: 'cross',
                  label: {
                    backgroundColor: '#6a7985'
                  }
                }
              },
              legend: {
                data: ['数量'],
                left: 'right', // 水平居中
                top: '0%',     // 垂直位置
                itemGap: 20,    // 图例项间距
                textStyle: {
                  color: '#333',
                  fontSize: 11
                }
              }
            }
            //画出图像
            //进行画图，画出这段时间的趋势图
            this.$nextTick(() => {
              if (!this.stationNub) {
                this.stationNub = echarts.init(this.$refs.stationNub)
              }
              //画故障数量的趋势图
              this.stationNub.setOption(chartStationNub)
            })

            //画出是否解除的趋势图，建立一个空变量
            let stationNubFinish = {
              title: {
                textStyle: {
                  color: '#333',
                  fontSize: 14
                },
                x: 'center',
                text: this.dateTimeScope[0] + '——' + this.dateTimeScope[1] + '报警数量趋势图',
              },
              xAxis: {
                type: 'category',
                data: [],
                axisLabel: {
                  rotate: 45,
                  fontSize: 11
                }
              },
              yAxis: {
                type: 'value',
                min: 0,
                max: 10,
                axisLabel: {
                  formatter: '{value}'
                }
              },
              series: [
                {
                  name: '全天数量',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#1890ff'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
                {
                  name: '记录数量',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#5470C6'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
                {
                  name: '未记录数量',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#91CC75'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
              ],
              grid: {
                top: '6%',
                left: '3%',
                right: '4%',
                bottom: '0%',
                containLabel: true
              },
              tooltip: {
                trigger: 'axis',
                axisPointer: {
                  type: 'cross',
                  label: {
                    backgroundColor: '#6a7985'
                  }
                }
              },
              legend: {
                data: ['全天数量', '记录数量', '未记录数量'],
                left: 'right',
                top: '0%',
                itemGap: 20,
                textStyle: {
                  color: '#333',
                  fontSize: 11
                },
                selected: {
                  '全天数量': true,
                  '记录数量': true,
                  '未记录数量': true
                },
                toolbox: {
                  feature: {
                    saveAsImage: {
                      type: 'png',
                      name: '报警数量趋势图',
                      title: '',
                      pixelRatio: 2,
                      backgroundColor: '#fff',
                      excludeComponents: ['toolbox']
                    },
                    myCopy: {
                      show: true,
                      title: '',
                      icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                      onclick: async () => {
                        if (!this.stationNub) {
                          alert('图表未初始化');
                          return;
                        }
                        // 清除选中状态
                        this.stationNub.dispatchAction({
                          type: 'unselect',
                          seriesIndex: 0
                        });

                        const dataUrl = this.stationNub.getDataURL({
                          type: 'png',
                          pixelRatio: 2,
                          backgroundColor: '#fff'
                        });

                        try {
                          // 将 DataURL 转换为 Blob
                          const response = await fetch(dataUrl);
                          const blob = await response.blob();

                          // 使用 Clipboard API 复制图片
                          await navigator.clipboard.write([
                            new ClipboardItem({
                              [blob.type]: blob
                            })
                          ]);
                          this.$message.success('已复制');
                        } catch (err) {
                          this.$message.success('复制失败');
                        }
                      }
                    }
                  },
                  right: '0%',
                  top: '90%',
                  itemSize: 14,
                  itemGap: 10,
                  textStyle: {
                    fontSize: 11
                  },
                  iconStyle: {
                    borderColor: '#666',
                    borderWidth: 1,
                    backgroundColor: '#f5f5f5'
                  }
                }

              },
            }
            this.$nextTick(() => {
              if (!this.stationNubFinish) {
                this.stationNubFinish = echarts.init(this.$refs.stationNubFinish);
              }
              this.stationNubFinish.setOption(stationNubFinish);
            });
            //
            //建立一个变量，画出各个部门需要解除报警的数量，已经记录的数量，未解除的数量
            let stationDepartment = {
              title: {
                textStyle: {
                  color: '#333',
                  fontSize: 14
                },
                x: 'center',
                text: '责任部门趋势图',
              },
              xAxis: {
                type: 'category',
                data: ['班长', '品技', '品检', 'MU'],
                axisLabel: {
                  rotate: 45,
                  fontSize: 11
                }
              },
              yAxis: {
                type: 'value',
                min: 0,
                max: 40,
                axisLabel: {
                  formatter: '{value}'
                }
              },
              series: [
                {
                  name: '总数',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#1890ff'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
                {
                  name: '已记录',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#5470C6'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
                {
                  name: '未记录',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#91CC75'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
              ],
              grid: {
                top: '6%',
                left: '3%',
                right: '4%',
                bottom: '0%',
                containLabel: true
              },
              tooltip: {
                trigger: 'axis',
                axisPointer: {
                  type: 'cross',
                  label: {
                    backgroundColor: '#6a7985'
                  }
                }
              },
              legend: {
                data: ['总数', '已记录', '未记录',],
                left: 'right',
                orient: 'vertical',
                top: '5%',
                itemGap: 20,
                textStyle: {
                  color: '#333',
                  fontSize: 11
                },
                selected: {
                  '全天数量': true,
                  '记录数量': true,
                  '未记录数量': true
                },
                toolbox: {
                  feature: {
                    saveAsImage: {
                      type: 'png',
                      name: '报警数量趋势图',
                      title: '',
                      pixelRatio: 2,
                      backgroundColor: '#fff',
                      excludeComponents: ['toolbox']
                    },
                    myCopy: {
                      show: true,
                      title: '',
                      icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                      onclick: async () => {
                        if (!this.stationNub) {
                          alert('图表未初始化');
                          return;
                        }
                        // 清除选中状态
                        this.stationNub.dispatchAction({
                          type: 'unselect',
                          seriesIndex: 0
                        });

                        const dataUrl = this.stationNub.getDataURL({
                          type: 'png',
                          pixelRatio: 2,
                          backgroundColor: '#fff'
                        });

                        try {
                          // 将 DataURL 转换为 Blob
                          const response = await fetch(dataUrl);
                          const blob = await response.blob();

                          // 使用 Clipboard API 复制图片
                          await navigator.clipboard.write([
                            new ClipboardItem({
                              [blob.type]: blob
                            })
                          ]);
                          this.$message.success('已复制');
                        } catch (err) {
                          this.$message.success('复制失败');
                        }
                      }
                    }
                  },
                  right: '0%',
                  top: '90%',
                  itemSize: 14,
                  itemGap: 10,
                  textStyle: {
                    fontSize: 11
                  },
                  iconStyle: {
                    borderColor: '#666',
                    borderWidth: 1,
                    backgroundColor: '#f5f5f5'
                  }
                }

              },
            }
            this.$nextTick(() => {
              if (!this.stationDepartment) {
                this.stationDepartment = echarts.init(this.$refs.stationDepartment);
              }
              this.stationDepartment.setOption(stationDepartment);
            });
          }
        })
      }
    },
    //用户现在不同的班次，去筛选信息
    shiftTypeChange(){
      if (this.dateOneDay !== '' && this.dateOneDay !== undefined && this.dateOneDay !== null) {
        let timeTemp = []
        if (this.shiftType === '早班/morning Shift/Ранняя смена') {
          timeTemp = [this.dateOneDay + ' 13:20:00', this.dateOneDay + ' 22:20:00']
        } else if (this.shiftType === '中班/middle shift/Средний класс') {
          // 创建日期对象
          const date = new Date(this.dateOneDay);

          // 创建两个时间点
          const startTime = new Date(date);
          startTime.setHours(17, 20, 0);

          const endTime = new Date(date);
          endTime.setDate(endTime.getDate() + 1); // 增加一天
          endTime.setHours(2, 20, 0);

          // 格式化为字符串
          const formatDate = (d) => {
            const year = d.getFullYear();
            const month = String(d.getMonth() + 1).padStart(2, '0');
            const day = String(d.getDate()).padStart(2, '0');
            return `${year}-${month}-${day}`;
          };

          timeTemp = [
            `${formatDate(startTime)} ${'22:20:00'}`,
            `${formatDate(endTime)} ${'07:20:00'}`
          ];
        } else if (this.shiftType === '夜班/night shift/Ночная работа') {
          // 创建日期对象
          const date = new Date(this.dateOneDay);

          // 创建两个时间点
          const startTime = new Date(date);
          startTime.setHours(17, 20, 0);

          const endTime = new Date(date);
          endTime.setDate(endTime.getDate() + 1); // 增加一天
          endTime.setHours(2, 20, 0);

          // 格式化为字符串
          const formatDate = (d) => {
            const year = d.getFullYear();
            const month = String(d.getMonth() + 1).padStart(2, '0');
            const day = String(d.getDate()).padStart(2, '0');
            return `${year}-${month}-${day}`;
          };

          timeTemp = [
            `${formatDate(endTime)} ${'07:20:00'}`,
            `${formatDate(endTime)} ${'13:20:00'}`
          ];
        }
        if (timeTemp.length > 0) {
          this.exceptionData = []
          this.queryExceptionOneFiledScopeWorkExceptionRemoval('excDate', timeTemp[0], timeTemp[1]).then(data => {
            //根据用户选择的车间类型，对数据进行过滤掉
            let dataFil = []
            if (this.buttonDoe === 1) {
              dataFil = data
            } else if (this.buttonDoe === 2) {
              dataFil = data.filter(item => item.workShop === '装配车间/Assembly workshop/Цех сборки двигателей')
            }
            if (this.opTypeList==='' || this.opTypeList===undefined || this.opTypeList===null){
              this.exceptionData = dataFil
            }
            else {
              this.exceptionData =dataFil.filter(item=>item.op=this.opTypeList)
            }
            this.dateTimeScope = timeTemp
            //建立一个变量，准备画图
            let chartStationNub = {
              title: {
                textStyle: {
                  color: '#333',
                  fontSize: 14
                },
                x: 'center',
                text: this.dateOneDay + '——' + this.shiftType + '报警数量趋势图',
              },
              xAxis: {
                type: 'category',
                data: [],
                axisLabel: {
                  rotate: 45,
                  fontSize: 11
                }
              },
              yAxis: {
                type: 'value',
                min: 0,
                max: 10,
                axisLabel: {
                  formatter: '{value}'
                }
              },
              series: [
                {
                  name: '故障数量',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#1890ff'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                }
              ],
              grid: {
                top: '6%',
                left: '3%',
                right: '4%',
                bottom: '0%',
                containLabel: true
              },
              tooltip: {
                trigger: 'axis',
                axisPointer: {
                  type: 'cross',
                  label: {
                    backgroundColor: '#6a7985'
                  }
                }
              },
              legend: {
                data: ['数量'],
                left: 'right',
                top: '0%',
                itemGap: 20,
                textStyle: {
                  color: '#333',
                  fontSize: 11
                }
              },
              toolbox: {
                feature: {
                  saveAsImage: {
                    type: 'png',
                    name: '报警数量趋势图',
                    title: '',
                    pixelRatio: 2,
                    backgroundColor: '#fff',
                    excludeComponents: ['toolbox']
                  },
                  myCopy: {
                    show: true,
                    title: '',
                    icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                    onclick: async () => {
                      if (!this.stationNub) {
                        alert('图表未初始化');
                        return;
                      }
                      // 清除选中状态
                      this.stationNub.dispatchAction({
                        type: 'unselect',
                        seriesIndex: 0
                      });

                      const dataUrl = this.stationNub.getDataURL({
                        type: 'png',
                        pixelRatio: 2,
                        backgroundColor: '#fff'
                      });

                      try {
                        // 将 DataURL 转换为 Blob
                        const response = await fetch(dataUrl);
                        const blob = await response.blob();

                        // 使用 Clipboard API 复制图片
                        await navigator.clipboard.write([
                          new ClipboardItem({
                            [blob.type]: blob
                          })
                        ]);
                        this.$message.success('已复制');
                      } catch (err) {
                        this.$message.success('复制失败');
                      }
                    }
                  }
                },
                right: '0%',
                top: '90%',
                itemSize: 14,
                itemGap: 10,
                textStyle: {
                  fontSize: 11
                },
                iconStyle: {
                  borderColor: '#666',
                  borderWidth: 1,
                  backgroundColor: '#f5f5f5'
                }
              }
            };
            //画出是否解除的趋势图，建立一个空变量
            let stationNubFinish = {
              title: {
                textStyle: {
                  color: '#333',
                  fontSize: 14
                },
                x: 'center',
                text: this.dateOneDay + '——' + this.shiftType + '报警数量趋势图',
              },
              xAxis: {
                type: 'category',
                data: [],
                axisLabel: {
                  rotate: 45,
                  fontSize: 11
                }
              },
              yAxis: {
                type: 'value',
                min: 0,
                max: 10,
                axisLabel: {
                  formatter: '{value}'
                }
              },
              series: [
                {
                  name: '全天数量',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#1890ff'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
                {
                  name: '记录数量',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#5470C6'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
                {
                  name: '未记录数量',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#91CC75'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
              ],
              grid: {
                top: '6%',
                left: '3%',
                right: '4%',
                bottom: '0%',
                containLabel: true
              },
              tooltip: {
                trigger: 'axis',
                axisPointer: {
                  type: 'cross',
                  label: {
                    backgroundColor: '#6a7985'
                  }
                }
              },
              legend: {
                data: ['全天数量', '记录数量', '未记录数量'],
                left: 'right',
                top: '0%',
                itemGap: 20,
                textStyle: {
                  color: '#333',
                  fontSize: 11
                },
                selected: {
                  '全天数量': true,
                  '记录数量': true,
                  '未记录数量': true
                },
                toolbox: {
                  feature: {
                    saveAsImage: {
                      type: 'png',
                      name: '报警数量趋势图',
                      title: '',
                      pixelRatio: 2,
                      backgroundColor: '#fff',
                      excludeComponents: ['toolbox']
                    },
                    myCopy: {
                      show: true,
                      title: '',
                      icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                      onclick: async () => {
                        if (!this.stationNub) {
                          alert('图表未初始化');
                          return;
                        }
                        // 清除选中状态
                        this.stationNub.dispatchAction({
                          type: 'unselect',
                          seriesIndex: 0
                        });

                        const dataUrl = this.stationNub.getDataURL({
                          type: 'png',
                          pixelRatio: 2,
                          backgroundColor: '#fff'
                        });

                        try {
                          // 将 DataURL 转换为 Blob
                          const response = await fetch(dataUrl);
                          const blob = await response.blob();

                          // 使用 Clipboard API 复制图片
                          await navigator.clipboard.write([
                            new ClipboardItem({
                              [blob.type]: blob
                            })
                          ]);
                          this.$message.success('已复制');
                        } catch (err) {
                          this.$message.success('复制失败');
                        }
                      }
                    }
                  },
                  right: '0%',
                  top: '90%',
                  itemSize: 14,
                  itemGap: 10,
                  textStyle: {
                    fontSize: 11
                  },
                  iconStyle: {
                    borderColor: '#666',
                    borderWidth: 1,
                    backgroundColor: '#f5f5f5'
                  }
                }

              },
            }
            //建立一个变量，画出各个部门需要解除报警的数量，已经记录的数量，未解除的数量
            let stationDepartment = {
              title: {
                textStyle: {
                  color: '#333',
                  fontSize: 14
                },
                x: 'center',
                text: '责任部门趋势图',
              },
              xAxis: {
                type: 'category',
                data: ['班长', '品技', '品检', 'MU'],
                axisLabel: {
                  rotate: 45,
                  fontSize: 11
                }
              },
              yAxis: {
                type: 'value',
                min: 0,
                max: 40,
                axisLabel: {
                  formatter: '{value}'
                }
              },
              series: [
                {
                  name: '总数',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#1890ff'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
                {
                  name: '已记录',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#5470C6'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
                {
                  name: '未记录',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#91CC75'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
              ],
              grid: {
                top: '6%',
                left: '3%',
                right: '4%',
                bottom: '0%',
                containLabel: true
              },
              tooltip: {
                trigger: 'axis',
                axisPointer: {
                  type: 'cross',
                  label: {
                    backgroundColor: '#6a7985'
                  }
                }
              },
              legend: {
                data: ['总数', '已记录', '未记录',],
                left: 'right',
                orient: 'vertical',
                top: '5%',
                itemGap: 20,
                textStyle: {
                  color: '#333',
                  fontSize: 11
                },
                selected: {
                  '全天数量': true,
                  '记录数量': true,
                  '未记录数量': true
                },
                toolbox: {
                  feature: {
                    saveAsImage: {
                      type: 'png',
                      name: '报警数量趋势图',
                      title: '',
                      pixelRatio: 2,
                      backgroundColor: '#fff',
                      excludeComponents: ['toolbox']
                    },
                    myCopy: {
                      show: true,
                      title: '',
                      icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                      onclick: async () => {
                        if (!this.stationNub) {
                          alert('图表未初始化');
                          return;
                        }
                        // 清除选中状态
                        this.stationNub.dispatchAction({
                          type: 'unselect',
                          seriesIndex: 0
                        });

                        const dataUrl = this.stationNub.getDataURL({
                          type: 'png',
                          pixelRatio: 2,
                          backgroundColor: '#fff'
                        });

                        try {
                          // 将 DataURL 转换为 Blob
                          const response = await fetch(dataUrl);
                          const blob = await response.blob();

                          // 使用 Clipboard API 复制图片
                          await navigator.clipboard.write([
                            new ClipboardItem({
                              [blob.type]: blob
                            })
                          ]);
                          this.$message.success('已复制');
                        } catch (err) {
                          this.$message.success('复制失败');
                        }
                      }
                    }
                  },
                  right: '0%',
                  top: '90%',
                  itemSize: 14,
                  itemGap: 10,
                  textStyle: {
                    fontSize: 11
                  },
                  iconStyle: {
                    borderColor: '#666',
                    borderWidth: 1,
                    backgroundColor: '#f5f5f5'
                  }
                }

              },
            }
            //画图表，画出这段时间各个工序报警的数量，需要校验，是有数据的时候画图
            if (this.exceptionData.length > 0) {
              // 用于存储op值的统计结果
              const opCountMap = {};
              // 遍历数组，统计每个op值的出现次数
              this.exceptionData.forEach(item => {
                const op = item.op;
                if (opCountMap[op]) {
                  opCountMap[op]++;
                } else {
                  opCountMap[op] = 1;
                }
              });
              // 将统计结果转换为所需的格式
              const result = Object.keys(opCountMap).map(op => ({
                op: op,
                nub: opCountMap[op]
              }));
              result.sort((a, b) => b.nub - a.nub);
              for (let i = 0; i < result.length; i++) {
                //添加横坐标：
                chartStationNub.xAxis.data.push(result[i].op)
                //添加纵坐标：
                chartStationNub.series[0].data.push(result[i].nub)
              }
              //给Y坐标赋值
              chartStationNub.yAxis.max = result[0].nub + 1
              //画出图像
              //进行画图，画出这段时间的趋势图
              this.$nextTick(() => {
                if (!this.stationNub) {
                  this.stationNub = echarts.init(this.$refs.stationNub)
                }
                //画故障数量的趋势图
                this.stationNub.setOption(chartStationNub)
              })


              //画出故障报警的解除记录图，分为总数、已登记处理、未登记处理
              //借用上一个数据X轴、变量的总数值
              stationNubFinish.xAxis.data = chartStationNub.xAxis.data
              stationNubFinish.series[0].data = chartStationNub.series[0].data
              stationNubFinish.yAxis.max = chartStationNub.yAxis.max
              //循环，查每一个工序下的数据.
              for (let i = 0; i < stationNubFinish.xAxis.data.length; i++) {
                //筛选数据，并赋值
                let finish = data.filter(item => item.op === stationNubFinish.xAxis.data[i] && item.liftName === '')
                stationNubFinish.series[2].data.push(finish.length)
                let finishNo = data.filter(item => item.op === stationNubFinish.xAxis.data[i] && item.liftName !== '')
                stationNubFinish.series[1].data.push(finishNo.length)
              }
              this.$nextTick(() => {
                if (!this.stationNubFinish) {
                  this.stationNubFinish = echarts.init(this.$refs.stationNubFinish);
                }
                this.stationNubFinish.setOption(stationNubFinish);
              });

              //画出各个部门负责的报警解除情况，含未记录、已记录
              //定义一个变量，在筛选班长后的数据中，找到报警等级为班长的记录，并对变量进行赋值
              let departmentTemp = this.exceptionData.filter(item => item.alarmLevel === '班长')
              //将筛选班长后得到当天所有的条数记录为图表中的总数
              stationDepartment.series[0].data.push(String(departmentTemp.length))
              //定义一个变量，存放班长未确认的总数，在筛选数据为空的数量
              let stationBZNo = departmentTemp.filter(item => item.liftName === '' || item.liftName === undefined || item.liftName === null)
              //将筛选后 班长确认的总数 - 筛选为空的总数 得到 已记录的总数 赋值给图表中已记录的数据
              stationDepartment.series[1].data.push(String(departmentTemp.length - stationBZNo.length))
              //将筛选后 筛选为空的总数，赋值给图表中未记录的数据
              stationDepartment.series[2].data.push(String(stationBZNo.length))

              //使用前面定义变量，记录筛选品检后的数据，
              departmentTemp = this.exceptionData.filter(item => item.alarmLevel === '品技')
              //将筛选品检后得到当天所有的条数记录为图表中的总数
              stationDepartment.series[0].data.push(String(departmentTemp.length))
              //定义一个变量，存放品检未确认的总数，在筛选数据为空的数量
              let stationPINJIANNo = departmentTemp.filter(item => item.liftName === '' || item.liftName === undefined || item.liftName === null)
              console.log('到这里了',stationPINJIANNo,departmentTemp)
              //将筛选后 品检确认的总数 - 筛选为空的总数 得到 已记录的总数 赋值给图表中已记录的数据
              stationDepartment.series[1].data.push(String(departmentTemp.length - stationPINJIANNo.length))
              //将筛选后 筛选为空的总数，赋值给图表中未记录的数据
              stationDepartment.series[2].data.push(String(stationPINJIANNo.length))

              //使用前面定义变量，记录筛选品技后的数据，
              departmentTemp = this.exceptionData.filter(item => item.alarmLevel === '品检')
              //将筛选品检后得到当天所有的条数记录为图表中的总数
              stationDepartment.series[0].data.push(String(departmentTemp.length))
              //定义一个变量，存放品检未确认的总数，在筛选数据为空的数量
              let stationPINJINo = departmentTemp.filter(item => item.liftName === '' || item.liftName === undefined || item.liftName === null)
              //将筛选后 品检确认的总数 - 筛选为空的总数 得到 已记录的总数 赋值给图表中已记录的数据
              stationDepartment.series[1].data.push(String(departmentTemp.length - stationPINJINo.length))
              //将筛选后 筛选为空的总数，赋值给图表中未记录的数据
              stationDepartment.series[2].data.push(String(stationPINJINo.length))

              //使用前面定义变量，记录筛选品技后的数据，
              departmentTemp = this.exceptionData.filter(item => item.alarmLevel === '设备')
              //将筛选品检后得到当天所有的条数记录为图表中的总数
              stationDepartment.series[0].data.push(String(departmentTemp.length))
              //定义一个变量，存放品检未确认的总数，在筛选数据为空的数量
              let stationMUNo = departmentTemp.filter(item => item.liftName === '' || item.liftName === undefined || item.liftName === null)
              //将筛选后 品检确认的总数 - 筛选为空的总数 得到 已记录的总数 赋值给图表中已记录的数据
              stationDepartment.series[1].data.push(String(departmentTemp.length - stationMUNo.length))
              //将筛选后 筛选为空的总数，赋值给图表中未记录的数据
              stationDepartment.series[2].data.push(String(stationMUNo.length))
              //
              stationDepartment.yAxis.max = String(Math.round(this.exceptionData.length * 1.05))


              this.$nextTick(() => {
                if (!this.stationDepartment) {
                  this.stationDepartment = echarts.init(this.$refs.stationDepartment);
                }
                this.stationDepartment.setOption(stationDepartment);
              });
            } else {
              chartStationNub = {
                title: {
                  textStyle: {
                    color: '#333',
                    fontSize: 14
                  },
                  x: 'center',
                  text: this.dateOneDay + '——' + this.shiftType + '趋势图',
                },
                xAxis: {
                  type: 'category',
                  data: [],
                  axisLabel: {
                    rotate: 45,
                    fontSize: 11 // 添加字体大小设置
                  }
                },
                yAxis: {
                  type: 'value',
                  min: 0,
                  max: 10,
                  axisLabel: {
                    formatter: '{value}'
                  }
                },
                series: [
                  {
                    name: '故障数量',
                    type: 'bar',
                    data: [],
                    itemStyle: {
                      color: '#1890ff' // 将颜色改为青蓝色
                    },
                    lineStyle: {
                      width: 2,
                      type: 'dashed'
                    },
                    label: {
                      show: true, // 显示标签
                      position: 'top', // 标签显示在柱子上方
                      color: '#333', // 标签文字颜色
                      fontSize: 11, // 标签文字大小
                      formatter: '{c}' // 显示数据值
                    }
                  }
                ],
                grid: {
                  top: '6%',    // 为标题和图例留出空间
                  left: '3%',
                  right: '4%',
                  bottom: '0%',
                  containLabel: true
                },
                tooltip: {
                  trigger: 'axis',
                  axisPointer: {
                    type: 'cross',
                    label: {
                      backgroundColor: '#6a7985'
                    }
                  }
                },
                legend: {
                  data: ['数量'],
                  left: 'right', // 水平居中
                  top: '0%',     // 垂直位置
                  itemGap: 20,    // 图例项间距
                  textStyle: {
                    color: '#333',
                    fontSize: 11
                  }
                }
              }
              //画出图像
              //进行画图，画出这段时间的趋势图
              this.$nextTick(() => {
                if (!this.stationNub) {
                  this.stationNub = echarts.init(this.$refs.stationNub)
                }
                //画故障数量的趋势图
                this.stationNub.setOption(chartStationNub)
              })

              //画出是否解除的趋势图，建立一个空变量
              let stationNubFinish = {
                title: {
                  textStyle: {
                    color: '#333',
                    fontSize: 14
                  },
                  x: 'center',
                  text: this.dateTimeScope[0] + '——' + this.dateTimeScope[1] + '报警数量趋势图',
                },
                xAxis: {
                  type: 'category',
                  data: [],
                  axisLabel: {
                    rotate: 45,
                    fontSize: 11
                  }
                },
                yAxis: {
                  type: 'value',
                  min: 0,
                  max: 10,
                  axisLabel: {
                    formatter: '{value}'
                  }
                },
                series: [
                  {
                    name: '全天数量',
                    type: 'bar',
                    data: [],
                    itemStyle: {
                      color: '#1890ff'
                    },
                    lineStyle: {
                      width: 2,
                      type: 'dashed'
                    },
                    label: {
                      show: true,
                      position: 'top',
                      color: '#333',
                      fontSize: 11,
                      formatter: '{c}'
                    }
                  },
                  {
                    name: '记录数量',
                    type: 'bar',
                    data: [],
                    itemStyle: {
                      color: '#5470C6'
                    },
                    lineStyle: {
                      width: 2,
                      type: 'dashed'
                    },
                    label: {
                      show: true,
                      position: 'top',
                      color: '#333',
                      fontSize: 11,
                      formatter: '{c}'
                    }
                  },
                  {
                    name: '未记录数量',
                    type: 'bar',
                    data: [],
                    itemStyle: {
                      color: '#91CC75'
                    },
                    lineStyle: {
                      width: 2,
                      type: 'dashed'
                    },
                    label: {
                      show: true,
                      position: 'top',
                      color: '#333',
                      fontSize: 11,
                      formatter: '{c}'
                    }
                  },
                ],
                grid: {
                  top: '6%',
                  left: '3%',
                  right: '4%',
                  bottom: '0%',
                  containLabel: true
                },
                tooltip: {
                  trigger: 'axis',
                  axisPointer: {
                    type: 'cross',
                    label: {
                      backgroundColor: '#6a7985'
                    }
                  }
                },
                legend: {
                  data: ['全天数量', '记录数量', '未记录数量'],
                  left: 'right',
                  top: '0%',
                  itemGap: 20,
                  textStyle: {
                    color: '#333',
                    fontSize: 11
                  },
                  selected: {
                    '全天数量': true,
                    '记录数量': true,
                    '未记录数量': true
                  },
                  toolbox: {
                    feature: {
                      saveAsImage: {
                        type: 'png',
                        name: '报警数量趋势图',
                        title: '',
                        pixelRatio: 2,
                        backgroundColor: '#fff',
                        excludeComponents: ['toolbox']
                      },
                      myCopy: {
                        show: true,
                        title: '',
                        icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                        onclick: async () => {
                          if (!this.stationNub) {
                            alert('图表未初始化');
                            return;
                          }
                          // 清除选中状态
                          this.stationNub.dispatchAction({
                            type: 'unselect',
                            seriesIndex: 0
                          });

                          const dataUrl = this.stationNub.getDataURL({
                            type: 'png',
                            pixelRatio: 2,
                            backgroundColor: '#fff'
                          });

                          try {
                            // 将 DataURL 转换为 Blob
                            const response = await fetch(dataUrl);
                            const blob = await response.blob();

                            // 使用 Clipboard API 复制图片
                            await navigator.clipboard.write([
                              new ClipboardItem({
                                [blob.type]: blob
                              })
                            ]);
                            this.$message.success('已复制');
                          } catch (err) {
                            this.$message.success('复制失败');
                          }
                        }
                      }
                    },
                    right: '0%',
                    top: '90%',
                    itemSize: 14,
                    itemGap: 10,
                    textStyle: {
                      fontSize: 11
                    },
                    iconStyle: {
                      borderColor: '#666',
                      borderWidth: 1,
                      backgroundColor: '#f5f5f5'
                    }
                  }

                },
              }
              this.$nextTick(() => {
                if (!this.stationNubFinish) {
                  this.stationNubFinish = echarts.init(this.$refs.stationNubFinish);
                }
                this.stationNubFinish.setOption(stationNubFinish);
              })

              //建立一个变量，画出各个部门需要解除报警的数量，已经记录的数量，未解除的数量
              let stationDepartment = {
                title: {
                  textStyle: {
                    color: '#333',
                    fontSize: 14
                  },
                  x: 'center',
                  text: '责任部门趋势图',
                },
                xAxis: {
                  type: 'category',
                  data: ['班长', '品技', '品检', 'MU'],
                  axisLabel: {
                    rotate: 45,
                    fontSize: 11
                  }
                },
                yAxis: {
                  type: 'value',
                  min: 0,
                  max: 40,
                  axisLabel: {
                    formatter: '{value}'
                  }
                },
                series: [
                  {
                    name: '总数',
                    type: 'bar',
                    data: [],
                    itemStyle: {
                      color: '#1890ff'
                    },
                    lineStyle: {
                      width: 2,
                      type: 'dashed'
                    },
                    label: {
                      show: true,
                      position: 'top',
                      color: '#333',
                      fontSize: 11,
                      formatter: '{c}'
                    }
                  },
                  {
                    name: '已记录',
                    type: 'bar',
                    data: [],
                    itemStyle: {
                      color: '#5470C6'
                    },
                    lineStyle: {
                      width: 2,
                      type: 'dashed'
                    },
                    label: {
                      show: true,
                      position: 'top',
                      color: '#333',
                      fontSize: 11,
                      formatter: '{c}'
                    }
                  },
                  {
                    name: '未记录',
                    type: 'bar',
                    data: [],
                    itemStyle: {
                      color: '#91CC75'
                    },
                    lineStyle: {
                      width: 2,
                      type: 'dashed'
                    },
                    label: {
                      show: true,
                      position: 'top',
                      color: '#333',
                      fontSize: 11,
                      formatter: '{c}'
                    }
                  },
                ],
                grid: {
                  top: '6%',
                  left: '3%',
                  right: '4%',
                  bottom: '0%',
                  containLabel: true
                },
                tooltip: {
                  trigger: 'axis',
                  axisPointer: {
                    type: 'cross',
                    label: {
                      backgroundColor: '#6a7985'
                    }
                  }
                },
                legend: {
                  data: ['总数', '已记录', '未记录',],
                  left: 'right',
                  orient: 'vertical',
                  top: '5%',
                  itemGap: 20,
                  textStyle: {
                    color: '#333',
                    fontSize: 11
                  },
                  selected: {
                    '全天数量': true,
                    '记录数量': true,
                    '未记录数量': true
                  },
                  toolbox: {
                    feature: {
                      saveAsImage: {
                        type: 'png',
                        name: '报警数量趋势图',
                        title: '',
                        pixelRatio: 2,
                        backgroundColor: '#fff',
                        excludeComponents: ['toolbox']
                      },
                      myCopy: {
                        show: true,
                        title: '',
                        icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                        onclick: async () => {
                          if (!this.stationNub) {
                            alert('图表未初始化');
                            return;
                          }
                          // 清除选中状态
                          this.stationNub.dispatchAction({
                            type: 'unselect',
                            seriesIndex: 0
                          });

                          const dataUrl = this.stationNub.getDataURL({
                            type: 'png',
                            pixelRatio: 2,
                            backgroundColor: '#fff'
                          });

                          try {
                            // 将 DataURL 转换为 Blob
                            const response = await fetch(dataUrl);
                            const blob = await response.blob();

                            // 使用 Clipboard API 复制图片
                            await navigator.clipboard.write([
                              new ClipboardItem({
                                [blob.type]: blob
                              })
                            ]);
                            this.$message.success('已复制');
                          } catch (err) {
                            this.$message.success('复制失败');
                          }
                        }
                      }
                    },
                    right: '0%',
                    top: '90%',
                    itemSize: 14,
                    itemGap: 10,
                    textStyle: {
                      fontSize: 11
                    },
                    iconStyle: {
                      borderColor: '#666',
                      borderWidth: 1,
                      backgroundColor: '#f5f5f5'
                    }
                  }

                },
              }
              this.$nextTick(() => {
                if (!this.stationDepartment) {
                  this.stationDepartment = echarts.init(this.$refs.stationDepartment);
                }
                this.stationDepartment.setOption(stationDepartment);
              });
            }
          })
        }
      }
    },
    //用户选择一段时间的数据进行查看
    dateTimeScopeChange(newVal) {
      if (this.dateTimeScope.length > 0) {
        //归零按照班次选择的项目
        // this.shiftType = '';
        // this.dateOneDay = '';
        this.queryExceptionOneFiledScopeWorkExceptionRemoval('excDate', newVal[0], newVal[1]).then(data => {
          //根据用户选择的车间类型，对数据进行过滤掉
          let dataFil = []
          if (this.buttonDoe === 1) {
            dataFil = data
          } else if (this.buttonDoe === 2) {
            dataFil = data.filter(item => item.workShop === '装配车间/Assembly workshop/Цех сборки двигателей')
          }
          this.exceptionData = dataFil;
          //画出故障总的趋势图，建立的空变量
          let chartStationNub = {
            title: {
              textStyle: {
                color: '#333',
                fontSize: 14
              },
              x: 'center',
              text: this.dateTimeScope[0] + '——' + this.dateTimeScope[1] + '报警数量趋势图',
            },
            xAxis: {
              type: 'category',
              data: [],
              axisLabel: {
                rotate: 45,
                fontSize: 11
              }
            },
            yAxis: {
              type: 'value',
              min: 0,
              max: 10,
              axisLabel: {
                formatter: '{value}'
              }
            },
            series: [
              {
                name: '故障数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#1890ff'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              }
            ],
            grid: {
              top: '6%',
              left: '3%',
              right: '4%',
              bottom: '0%',
              containLabel: true
            },
            tooltip: {
              trigger: 'axis',
              axisPointer: {
                type: 'cross',
                label: {
                  backgroundColor: '#6a7985'
                }
              }
            },
            legend: {
              data: ['故障数量'],
              left: 'right',
              top: '0%',
              itemGap: 20,
              textStyle: {
                color: '#333',
                fontSize: 11
              }
            },
            toolbox: {
              feature: {
                saveAsImage: {
                  type: 'png',
                  name: '报警数量趋势图',
                  title: '',
                  pixelRatio: 2,
                  backgroundColor: '#fff',
                  excludeComponents: ['toolbox']
                },
                myCopy: {
                  show: true,
                  title: '',
                  icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                  onclick: async () => {
                    if (!this.stationNub) {
                      alert('图表未初始化');
                      return;
                    }
                    // 清除选中状态
                    this.stationNub.dispatchAction({
                      type: 'unselect',
                      seriesIndex: 0
                    });

                    const dataUrl = this.stationNub.getDataURL({
                      type: 'png',
                      pixelRatio: 2,
                      backgroundColor: '#fff'
                    });

                    try {
                      // 将 DataURL 转换为 Blob
                      const response = await fetch(dataUrl);
                      const blob = await response.blob();

                      // 使用 Clipboard API 复制图片
                      await navigator.clipboard.write([
                        new ClipboardItem({
                          [blob.type]: blob
                        })
                      ]);
                      this.$message.success('已复制');
                    } catch (err) {
                      this.$message.success('复制失败');
                    }
                  }
                }
              },
              right: '0%',
              top: '90%',
              itemSize: 14,
              itemGap: 10,
              textStyle: {
                fontSize: 11
              },
              iconStyle: {
                borderColor: '#666',
                borderWidth: 1,
                backgroundColor: '#f5f5f5'
              }
            }
          }
          //画出是否解除的趋势图，建立一个空变量
          let stationNubFinish = {
            title: {
              textStyle: {
                color: '#333',
                fontSize: 14
              },
              x: 'center',
              text: this.dateTimeScope[0] + '——' + this.dateTimeScope[1] + '报警数量趋势图',
            },
            xAxis: {
              type: 'category',
              data: [],
              axisLabel: {
                rotate: 45,
                fontSize: 11
              }
            },
            yAxis: {
              type: 'value',
              min: 0,
              max: 10,
              axisLabel: {
                formatter: '{value}'
              }
            },
            series: [
              {
                name: '全天数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#1890ff'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
              {
                name: '记录数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#5470C6'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
              {
                name: '未记录数量',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#91CC75'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
            ],
            grid: {
              top: '6%',
              left: '3%',
              right: '4%',
              bottom: '0%',
              containLabel: true
            },
            tooltip: {
              trigger: 'axis',
              axisPointer: {
                type: 'cross',
                label: {
                  backgroundColor: '#6a7985'
                }
              }
            },
            legend: {
              data: ['全天数量', '记录数量', '未记录数量'],
              left: 'right',
              orient: 'vertical',
              top: '5%',
              itemGap: 20,
              textStyle: {
                color: '#333',
                fontSize: 11
              },
              selected: {
                '全天数量': true,
                '记录数量': true,
                '未记录数量': true
              },
              toolbox: {
                feature: {
                  saveAsImage: {
                    type: 'png',
                    name: '报警数量趋势图',
                    title: '',
                    pixelRatio: 2,
                    backgroundColor: '#fff',
                    excludeComponents: ['toolbox']
                  },
                  myCopy: {
                    show: true,
                    title: '',
                    icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                    onclick: async () => {
                      if (!this.stationNub) {
                        alert('图表未初始化');
                        return;
                      }
                      // 清除选中状态
                      this.stationNub.dispatchAction({
                        type: 'unselect',
                        seriesIndex: 0
                      });

                      const dataUrl = this.stationNub.getDataURL({
                        type: 'png',
                        pixelRatio: 2,
                        backgroundColor: '#fff'
                      });

                      try {
                        // 将 DataURL 转换为 Blob
                        const response = await fetch(dataUrl);
                        const blob = await response.blob();

                        // 使用 Clipboard API 复制图片
                        await navigator.clipboard.write([
                          new ClipboardItem({
                            [blob.type]: blob
                          })
                        ]);
                        this.$message.success('已复制');
                      } catch (err) {
                        this.$message.success('复制失败');
                      }
                    }
                  }
                },
                right: '0%',
                top: '90%',
                itemSize: 14,
                itemGap: 10,
                textStyle: {
                  fontSize: 11
                },
                iconStyle: {
                  borderColor: '#666',
                  borderWidth: 1,
                  backgroundColor: '#f5f5f5'
                }
              }

            },
          }
          //建立一个变量，画出各个部门需要解除报警的数量，已经记录的数量，未解除的数量
          let stationDepartment = {
            title: {
              textStyle: {
                color: '#333',
                fontSize: 14
              },
              x: 'center',
              text: '责任部门趋势图',
            },
            xAxis: {
              type: 'category',
              data: ['班长', '品技', '品检', 'MU'],
              axisLabel: {
                rotate: 45,
                fontSize: 11
              }
            },
            yAxis: {
              type: 'value',
              min: 0,
              max: 40,
              axisLabel: {
                formatter: '{value}'
              }
            },
            series: [
              {
                name: '总数',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#1890ff'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
              {
                name: '已记录',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#5470C6'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
              {
                name: '未记录',
                type: 'bar',
                data: [],
                itemStyle: {
                  color: '#91CC75'
                },
                lineStyle: {
                  width: 2,
                  type: 'dashed'
                },
                label: {
                  show: true,
                  position: 'top',
                  color: '#333',
                  fontSize: 11,
                  formatter: '{c}'
                }
              },
            ],
            grid: {
              top: '6%',
              left: '3%',
              right: '4%',
              bottom: '0%',
              containLabel: true
            },
            tooltip: {
              trigger: 'axis',
              axisPointer: {
                type: 'cross',
                label: {
                  backgroundColor: '#6a7985'
                }
              }
            },
            legend: {
              data: ['总数', '已记录', '未记录',],
              left: 'right',
              orient: 'vertical',
              top: '5%',
              itemGap: 20,
              textStyle: {
                color: '#333',
                fontSize: 11
              },
              selected: {
                '全天数量': true,
                '记录数量': true,
                '未记录数量': true
              },
              toolbox: {
                feature: {
                  saveAsImage: {
                    type: 'png',
                    name: '报警数量趋势图',
                    title: '',
                    pixelRatio: 2,
                    backgroundColor: '#fff',
                    excludeComponents: ['toolbox']
                  },
                  myCopy: {
                    show: true,
                    title: '',
                    icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                    onclick: async () => {
                      if (!this.stationNub) {
                        alert('图表未初始化');
                        return;
                      }
                      // 清除选中状态
                      this.stationNub.dispatchAction({
                        type: 'unselect',
                        seriesIndex: 0
                      });

                      const dataUrl = this.stationNub.getDataURL({
                        type: 'png',
                        pixelRatio: 2,
                        backgroundColor: '#fff'
                      });

                      try {
                        // 将 DataURL 转换为 Blob
                        const response = await fetch(dataUrl);
                        const blob = await response.blob();

                        // 使用 Clipboard API 复制图片
                        await navigator.clipboard.write([
                          new ClipboardItem({
                            [blob.type]: blob
                          })
                        ]);
                        this.$message.success('已复制');
                      } catch (err) {
                        this.$message.success('复制失败');
                      }
                    }
                  }
                },
                right: '0%',
                top: '90%',
                itemSize: 14,
                itemGap: 10,
                textStyle: {
                  fontSize: 11
                },
                iconStyle: {
                  borderColor: '#666',
                  borderWidth: 1,
                  backgroundColor: '#f5f5f5'
                }
              }

            },
          }

          if (this.exceptionData.length > 0) {
            //画出总的报警数量
            const opCountMap = {};
            this.exceptionData.forEach(item => {
              const op = item.op;
              if (opCountMap[op]) {
                opCountMap[op]++;
              } else {
                opCountMap[op] = 1;
              }
            });
            const result = Object.keys(opCountMap).map(op => ({
              op: op,
              nub: opCountMap[op]
            }));
            result.sort((a, b) => b.nub - a.nub);
            for (let i = 0; i < result.length; i++) {
              chartStationNub.xAxis.data.push(result[i].op);
              chartStationNub.series[0].data.push(result[i].nub);
            }
            chartStationNub.yAxis.max = result[0].nub + 1;
            this.$nextTick(() => {
              if (!this.stationNub) {
                this.stationNub = echarts.init(this.$refs.stationNub);
              }
              this.stationNub.setOption(chartStationNub);
            });

            //画出故障报警的解除记录图，分为总数、已登记处理、未登记处理
            //借用上一个数据X轴、变量的总数值
            stationNubFinish.xAxis.data = chartStationNub.xAxis.data
            stationNubFinish.series[0].data = chartStationNub.series[0].data
            stationNubFinish.yAxis.max = chartStationNub.yAxis.max
            //循环，查每一个工序下的数据.
            for (let i = 0; i < stationNubFinish.xAxis.data.length; i++) {
              //筛选数据，并赋值
              let finish = data.filter(item => item.op === stationNubFinish.xAxis.data[i] && item.liftName === '')
              stationNubFinish.series[2].data.push(finish.length)
              let finishNo = data.filter(item => item.op === stationNubFinish.xAxis.data[i] && item.liftName !== '')
              stationNubFinish.series[1].data.push(finishNo.length)
            }
            this.$nextTick(() => {
              if (!this.stationNubFinish) {
                this.stationNubFinish = echarts.init(this.$refs.stationNubFinish);
              }
              this.stationNubFinish.setOption(stationNubFinish);
            });


            //画出各个部门负责的报警解除情况，含未记录、已记录
            //定义一个变量，在筛选班长后的数据中，找到报警等级为班长的记录，并对变量进行赋值
            let departmentTemp = this.exceptionData.filter(item => item.alarmLevel === '班长')
            //将筛选班长后得到当天所有的条数记录为图表中的总数
            stationDepartment.series[0].data.push(String(departmentTemp.length))
            //定义一个变量，存放班长未确认的总数，在筛选数据为空的数量
            let stationBZNo = departmentTemp.filter(item => item.liftName === '' || item.liftName === undefined || item.liftName === null)
            //将筛选后 班长确认的总数 - 筛选为空的总数 得到 已记录的总数 赋值给图表中已记录的数据
            stationDepartment.series[1].data.push(String(departmentTemp.length - stationBZNo.length))
            //将筛选后 筛选为空的总数，赋值给图表中未记录的数据
            stationDepartment.series[2].data.push(String(stationBZNo.length))

            //使用前面定义变量，记录筛选品检后的数据，
            departmentTemp = this.exceptionData.filter(item => item.alarmLevel === '品技')
            //将筛选品检后得到当天所有的条数记录为图表中的总数
            stationDepartment.series[0].data.push(String(departmentTemp.length))
            //定义一个变量，存放品检未确认的总数，在筛选数据为空的数量
            let stationPINJIANNo = departmentTemp.filter(item => item.liftName === '' || item.liftName === undefined || item.liftName === null)
            //将筛选后 品检确认的总数 - 筛选为空的总数 得到 已记录的总数 赋值给图表中已记录的数据
            stationDepartment.series[1].data.push(String(departmentTemp.length - stationPINJIANNo.length))
            //将筛选后 筛选为空的总数，赋值给图表中未记录的数据
            stationDepartment.series[2].data.push(String(stationPINJIANNo.length))

            //使用前面定义变量，记录筛选品技后的数据，
            departmentTemp = this.exceptionData.filter(item => item.alarmLevel === '品检')
            //将筛选品检后得到当天所有的条数记录为图表中的总数
            stationDepartment.series[0].data.push(String(departmentTemp.length))
            //定义一个变量，存放品检未确认的总数，在筛选数据为空的数量
            let stationPINJINo = departmentTemp.filter(item => item.liftName === '' || item.liftName === undefined || item.liftName === null)
            //将筛选后 品检确认的总数 - 筛选为空的总数 得到 已记录的总数 赋值给图表中已记录的数据
            stationDepartment.series[1].data.push(String(departmentTemp.length - stationPINJINo.length))
            //将筛选后 筛选为空的总数，赋值给图表中未记录的数据
            stationDepartment.series[2].data.push(String(stationPINJINo.length))

            //使用前面定义变量，记录筛选品技后的数据，
            departmentTemp = this.exceptionData.filter(item => item.alarmLevel === '设备')
            //将筛选品检后得到当天所有的条数记录为图表中的总数
            stationDepartment.series[0].data.push(String(departmentTemp.length))
            //定义一个变量，存放品检未确认的总数，在筛选数据为空的数量
            let stationMUNo = departmentTemp.filter(item => item.liftName === '' || item.liftName === undefined || item.liftName === null)
            //将筛选后 品检确认的总数 - 筛选为空的总数 得到 已记录的总数 赋值给图表中已记录的数据
            stationDepartment.series[1].data.push(String(departmentTemp.length - stationMUNo.length))
            //将筛选后 筛选为空的总数，赋值给图表中未记录的数据
            stationDepartment.series[2].data.push(String(stationMUNo.length))
            //
            stationDepartment.yAxis.max = String(Math.round(this.exceptionData.length * 1.05))


            this.$nextTick(() => {
              if (!this.stationDepartment) {
                this.stationDepartment = echarts.init(this.$refs.stationDepartment);
              }
              this.stationDepartment.setOption(stationDepartment);
            });


          } else {
            chartStationNub = {
              title: {
                textStyle: {
                  color: '#333',
                  fontSize: 14
                },
                x: 'center',
                text: this.dateTimeScope[0] + '——' + this.dateTimeScope[1] + '报警数量趋势图',
              },
              xAxis: {
                type: 'category',
                data: [],
                axisLabel: {
                  rotate: 45,
                  fontSize: 11
                }
              },
              yAxis: {
                type: 'value',
                min: 0,
                max: 10,
                axisLabel: {
                  formatter: '{value}'
                }
              },
              series: [
                {
                  name: '故障数量',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#1890ff'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                }
              ],
              grid: {
                top: '6%',
                left: '3%',
                right: '4%',
                bottom: '0%',
                containLabel: true
              },
              tooltip: {
                trigger: 'axis',
                axisPointer: {
                  type: 'cross',
                  label: {
                    backgroundColor: '#6a7985'
                  }
                }
              },
              legend: {
                data: ['故障数量'],
                left: 'right',
                top: '0%',
                itemGap: 20,
                textStyle: {
                  color: '#333',
                  fontSize: 11
                }
              }
            };
            stationNubFinish = {
              title: {
                textStyle: {
                  color: '#333',
                  fontSize: 14
                },
                x: 'center',
                text: this.dateTimeScope[0] + '——' + this.dateTimeScope[1] + '报警数量趋势图',
              },
              xAxis: {
                type: 'category',
                data: [],
                axisLabel: {
                  rotate: 45,
                  fontSize: 11
                }
              },
              yAxis: {
                type: 'value',
                min: 0,
                max: 10,
                axisLabel: {
                  formatter: '{value}'
                }
              },
              series: [
                {
                  name: '全天数量',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#1890ff'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
                {
                  name: '记录数量',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#5470C6'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
                {
                  name: '未记录数量',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#91CC75'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
              ],
              grid: {
                top: '6%',
                left: '3%',
                right: '4%',
                bottom: '0%',
                containLabel: true
              },
              tooltip: {
                trigger: 'axis',
                axisPointer: {
                  type: 'cross',
                  label: {
                    backgroundColor: '#6a7985'
                  }
                }
              },
              legend: {
                data: ['全天数量', '记录数量', '未记录数量'],
                left: 'right',
                orient: 'vertical',
                top: '5%',
                itemGap: 20,
                textStyle: {
                  color: '#333',
                  fontSize: 11
                },
                selected: {
                  '全天数量': true,
                  '记录数量': true,
                  '未记录数量': true
                },
                toolbox: {
                  feature: {
                    saveAsImage: {
                      type: 'png',
                      name: '报警数量趋势图',
                      title: '',
                      pixelRatio: 2,
                      backgroundColor: '#fff',
                      excludeComponents: ['toolbox']
                    },
                    myCopy: {
                      show: true,
                      title: '',
                      icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                      onclick: async () => {
                        if (!this.stationNub) {
                          alert('图表未初始化');
                          return;
                        }
                        // 清除选中状态
                        this.stationNub.dispatchAction({
                          type: 'unselect',
                          seriesIndex: 0
                        });

                        const dataUrl = this.stationNub.getDataURL({
                          type: 'png',
                          pixelRatio: 2,
                          backgroundColor: '#fff'
                        });

                        try {
                          // 将 DataURL 转换为 Blob
                          const response = await fetch(dataUrl);
                          const blob = await response.blob();

                          // 使用 Clipboard API 复制图片
                          await navigator.clipboard.write([
                            new ClipboardItem({
                              [blob.type]: blob
                            })
                          ]);
                          this.$message.success('已复制');
                        } catch (err) {
                          this.$message.success('复制失败');
                        }
                      }
                    }
                  },
                  right: '0%',
                  top: '90%',
                  itemSize: 14,
                  itemGap: 10,
                  textStyle: {
                    fontSize: 11
                  },
                  iconStyle: {
                    borderColor: '#666',
                    borderWidth: 1,
                    backgroundColor: '#f5f5f5'
                  }
                }
              },
            }
            this.$nextTick(() => {
              if (!this.stationNub) {
                this.stationNub = echarts.init(this.$refs.stationNub);
              }
              this.stationNub.setOption(chartStationNub);
            });
            this.$nextTick(() => {
              if (!this.stationNubFinish) {
                this.stationNubFinish = echarts.init(this.$refs.stationNubFinish);
              }
              this.stationNubFinish.setOption(stationNubFinish);
            });

            //建立一个变量，画出各个部门需要解除报警的数量，已经记录的数量，未解除的数量
            let stationDepartment = {
              title: {
                textStyle: {
                  color: '#333',
                  fontSize: 14
                },
                x: 'center',
                text: '责任部门趋势图',
              },
              xAxis: {
                type: 'category',
                data: ['班长', '品技', '品检', 'MU'],
                axisLabel: {
                  rotate: 45,
                  fontSize: 11
                }
              },
              yAxis: {
                type: 'value',
                min: 0,
                max: 40,
                axisLabel: {
                  formatter: '{value}'
                }
              },
              series: [
                {
                  name: '总数',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#1890ff'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
                {
                  name: '已记录',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#5470C6'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
                {
                  name: '未记录',
                  type: 'bar',
                  data: [],
                  itemStyle: {
                    color: '#91CC75'
                  },
                  lineStyle: {
                    width: 2,
                    type: 'dashed'
                  },
                  label: {
                    show: true,
                    position: 'top',
                    color: '#333',
                    fontSize: 11,
                    formatter: '{c}'
                  }
                },
              ],
              grid: {
                top: '6%',
                left: '3%',
                right: '4%',
                bottom: '0%',
                containLabel: true
              },
              tooltip: {
                trigger: 'axis',
                axisPointer: {
                  type: 'cross',
                  label: {
                    backgroundColor: '#6a7985'
                  }
                }
              },
              legend: {
                data: ['总数', '已记录', '未记录',],
                left: 'right',
                orient: 'vertical',
                top: '5%',
                itemGap: 20,
                textStyle: {
                  color: '#333',
                  fontSize: 11
                },
                selected: {
                  '全天数量': true,
                  '记录数量': true,
                  '未记录数量': true
                },
                toolbox: {
                  feature: {
                    saveAsImage: {
                      type: 'png',
                      name: '报警数量趋势图',
                      title: '',
                      pixelRatio: 2,
                      backgroundColor: '#fff',
                      excludeComponents: ['toolbox']
                    },
                    myCopy: {
                      show: true,
                      title: '',
                      icon: 'path://M4 7v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V7h-2v10H6V7H4zm6-5.5L17 7h-3v3h-4V7H7l7-5.5z',
                      onclick: async () => {
                        if (!this.stationNub) {
                          alert('图表未初始化');
                          return;
                        }
                        // 清除选中状态
                        this.stationNub.dispatchAction({
                          type: 'unselect',
                          seriesIndex: 0
                        });

                        const dataUrl = this.stationNub.getDataURL({
                          type: 'png',
                          pixelRatio: 2,
                          backgroundColor: '#fff'
                        });

                        try {
                          // 将 DataURL 转换为 Blob
                          const response = await fetch(dataUrl);
                          const blob = await response.blob();

                          // 使用 Clipboard API 复制图片
                          await navigator.clipboard.write([
                            new ClipboardItem({
                              [blob.type]: blob
                            })
                          ]);
                          this.$message.success('已复制');
                        } catch (err) {
                          this.$message.success('复制失败');
                        }
                      }
                    }
                  },
                  right: '0%',
                  top: '90%',
                  itemSize: 14,
                  itemGap: 10,
                  textStyle: {
                    fontSize: 11
                  },
                  iconStyle: {
                    borderColor: '#666',
                    borderWidth: 1,
                    backgroundColor: '#f5f5f5'
                  }
                }
              },
            }
            this.$nextTick(() => {
              if (!this.stationDepartment) {
                this.stationDepartment = echarts.init(this.$refs.stationDepartment);
              }
              this.stationDepartment.setOption(stationDepartment);
            });
          }

        });
      }
      //设置一下用户选择的时间，显示到这个早班到下一个早班.
      // this.dateTimeScope[0] = this.dateTimeScope[0].slice(0, 10) + ' 08:20:00'
      // this.dateTimeScope[1] = this.dateTimeScope[1].slice(0, 10) + ' 08:20:00'
    }

  },
  mounted() {
    this.inquiry()
    this.dateTimeScope = this.createTimeArray()
    //进行第一次数据筛选
    this.dateTimeScopeChange(this.dateTimeScope)
    this.dateTimeScopeOp = this.createTimeArrayOneMonthly(this.dateTimeScope[0].slice(0, 10), 30, '08:20:20')
    this.opType = 'OP500'
    // 确保默认加载数据
    this.loadExceptionData()
  },
  //组件销毁前的函数
  beforeDestroy() {
    // 组件销毁前，销毁 wangEditor 实例
    if (this.editor) {
      this.editor.destroy();
      this.editor = null;
    }
  },

}
</script>

<style scoped>
/* 主体左侧的工作步骤栏用到的数据包围的div的样式*/

.el-footer {
  background-color: #ffffff;
  color: #333;
  text-align: center;
  border-width: 3px; /* 设置边框宽度为3像素 */
  border-color: blue; /* 设置边框颜色为蓝色 */
  border-style: solid; /* 设置边框样式为实线 */
  padding: 10px; /* 添加内边距 */
  border-left-color: white;
  border-top: white;
}

.el-aside {
  background-color: #ffffff;
  color: #333;
  text-align: center;
  border-width: 3px; /* 设置边框宽度为3像素 */
  border-color: blue; /* 设置边框颜色为蓝色 */
  border-style: solid; /* 设置边框样式为实线 */
  padding: 10px; /* 添加内边距 */
  height: 89vh;
}

.el-main {
  color: #333;
  text-align: center;
  border-width: 3px; /* 设置边框宽度为3像素 */
  border-color: blue; /* 设置边框颜色为蓝色 */
  border-left-color: white;
  border-style: solid; /* 设置边框样式为实线 */
  padding: 10px; /* 添加内边距 */
}

body > .el-container {
  margin-bottom: 40px;
}

.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
  line-height: 260px;
}

.el-container:nth-child(7) .el-aside {
  line-height: 320px;
}

.headMain {
  color: #ffffff; /* 设置字体颜色为红色 */
  font-size: 18px;
}

.center-text {
  /* 使用 margin-left 和 margin-right auto 来实现居中效果 */
  margin-left: auto;
  margin-right: auto;
  /* 注意：如果 header 内只有这两个元素，你可能不需要 margin-right: auto */
}

/*自定义样式*/

.blue-border {
  border-collapse: collapse; /* 合并相邻的边框 */
  width: 100%; /* 设置表格宽度为100% */
}

.blue-border th,
.blue-border td {
  border: 1px solid blue; /* 设置边框颜色为蓝色，宽度为1px */
  padding: 8px; /* 设置单元格内边距，以使内容更清晰可见 */
}

/* 如果你只想为thead和tbody中的单元格设置边框，可以分别指定 */
.blue-border thead th,
.blue-border tbody td {
  /* 这里可以添加额外的thead或tbody特定的样式 */
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.clearfix:after {
  clear: both
}

.dialog-footer {
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中（如果按钮不是单行的话）*/
  padding: 10px; /* 你可以根据需要调整内边距 */
}
</style>